/* App-specific overrides on top of Tailwind CDN. Keep tiny. */ [x-cloak] { display: none !important; } /* Display typeface for headings (Latin → Space Grotesk; hy → Noto Sans Armenian; ru → Inter via fallback). Body text is Inter (set on ). */ h1, h2, .font-display { font-family: 'Space Grotesk', 'Noto Sans Armenian', 'Inter', system-ui, sans-serif; letter-spacing: -0.01em; } /* Markdown-rendered bio on landing + admin preview. Tailwind reset strips defaults, so put them back for the few tags we allow. */ .prose-bio p { margin: 0 0 0.75em; } .prose-bio p:last-child { margin-bottom: 0; } .prose-bio a { color: rgb(var(--accent-600)); text-decoration: underline; } .prose-bio a:hover { color: rgb(var(--accent-700)); } .prose-bio strong { font-weight: 600; } .prose-bio em { font-style: italic; } .prose-bio ul { list-style: disc; padding-left: 1.5em; margin: 0 0 0.75em; } .prose-bio ol { list-style: decimal; padding-left: 1.5em; margin: 0 0 0.75em; } .prose-bio li { margin: 0.15em 0; } .prose-bio h1, .prose-bio h2, .prose-bio h3 { font-weight: 600; margin: 0.6em 0 0.3em; } .prose-bio h1 { font-size: 1.25em; } .prose-bio h2 { font-size: 1.125em; } .prose-bio h3 { font-size: 1em; } .prose-bio code { background: rgb(241 245 249); padding: 0.1em 0.3em; border-radius: 3px; font-size: 0.9em; } .prose-bio blockquote { border-left: 3px solid rgb(203 213 225); padding-left: 0.75em; color: rgb(71 85 105); margin: 0 0 0.75em; } .prose-bio hr { border: 0; border-top: 1px solid rgb(226 232 240); margin: 1em 0; } .slot { min-height: 2.25rem; border: 1px solid rgb(226 232 240); /* slate-200 */ font-size: 0.75rem; line-height: 1rem; padding: 0.25rem; text-align: left; transition: background-color 80ms ease-in-out; } .slot--empty { background-color: #ffffff; cursor: pointer; } .slot--empty:hover { background-color: rgb(var(--accent-100)); } .slot--booked { background-color: rgb(254 249 195); /* yellow-100 */ cursor: pointer; font-weight: 500; } .slot--booked:hover { background-color: rgb(253 224 71); /* yellow-300 */ } .slot--active { outline: 2px solid rgb(var(--accent-600)); outline-offset: -2px; position: relative; z-index: 15; } .slot--gap { background-color: rgb(254 226 226); /* red-100 */ color: rgb(127 29 29); cursor: default; } .slot--off { background-color: rgb(226 232 240); /* slate-200 */ cursor: not-allowed; } /* Today column — subtle tint on top of the state color. */ .slot--today.slot--empty { background-color: rgb(var(--accent-50)); } .slot--today.slot--empty:hover { background-color: rgb(var(--accent-100)); } /* "Now" marker — thin accent on the current-time row of today's column. */ .slot--now { box-shadow: inset 2px 0 0 0 rgb(225 29 72); /* rose-600 left bar */ position: relative; } .slot--now::after { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: rgb(225 29 72); /* rose-600 */ pointer-events: none; } /* HTMX loading indicator. Hidden by default; shown while a request is in flight. */ .htmx-indicator { opacity: 0; transition: opacity 120ms; } .htmx-request .htmx-indicator { opacity: 1; } .htmx-request.htmx-indicator { opacity: 1; } /* Spinner */ .spinner { width: 1rem; height: 1rem; border: 2px solid rgb(203 213 225); /* slate-300 */ border-top-color: rgb(var(--accent-600)); border-radius: 9999px; animation: spin 700ms linear infinite; } @keyframes spin { to { transform: rotate(360deg); } } /* Print: keep only the week grid + its header (title + subtitle). Hide the app chrome (sidebar, mobile top bar, nav buttons, slot panel, flash). */ @media print { @page { size: landscape; margin: 1cm; } body { background: #ffffff !important; } /* Chrome to drop on print */ header, aside, #flash, #slot-panel, #slot-panel-spinner, [data-week-nav] { display: none !important; } main { padding: 0 !important; margin: 0 !important; } /* Let the grid take the full page width without horizontal scroll. */ #week-grid { overflow: visible !important; border: 1px solid #cbd5e1 !important; } #week-grid > div { min-width: 0 !important; } /* Preserve cell colors (yellow for booked, red for gaps, grey for off). */ .slot, #week-grid > div > div { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; } /* Drop the "now" rose marker — it only makes sense on-screen. */ .slot--now { box-shadow: none !important; } .slot--now::after { display: none !important; } /* Drop the active-cell selection outline (Alpine class + browser focus ring on the clicked