/** * Sales Igniter Rental -- skin of the unified flatpickr calendar (both theme modes), * ported from the WooCommerce plugin's sibooking-calendar-ui.css. * * Everything coloured derives from the custom properties Model\CalendarStyle prints * inline (:root{--sib-accent;--sib-accent-rgb;--sib-radius}) -- the Calendar Styler's * main colour and corner radius. The four skins (.sib-style-airy | card | bold | * classic) only change chrome. Scoped under .sib-cal (the calendar block) and .sib-fp * (the flatpickr container, which is appended to for popups). */ :root { --sib-accent: #0274be; --sib-accent-rgb: 2, 116, 190; --sib-radius: 10px; } .sib-cal, .sib-fp { --sib-ink: #1f2a37; --sib-navy: #10243d; --sib-muted: #5b6b7f; --sib-soft: #7d8fa3; --sib-line: #e4e9f0; --sib-card: #ffffff; --sib-ground: #f6f8fb; --sib-tint: rgba(var(--sib-accent-rgb), 0.12); --sib-tint-strong: rgba(var(--sib-accent-rgb), 0.22); --sib-ok-bg: #e7f6ec; --sib-ok: #166534; --sib-warn-bg: #fef3e7; --sib-warn: #b8560d; /* row HEIGHT (the columns are fluid); the WooCommerce plugin's figure */ --sib-cell: 44px; color: var(--sib-ink); } .sib-cal { position: relative; margin: 0 0 18px; max-width: 100%; box-sizing: border-box; /* only the wrapper is a container: inline-size containment on .sib-fp would give the inline calendar no intrinsic width and collapse it inside its mount */ container-type: inline-size; container-name: sibcal; } .sib-cal *, .sib-cal *::before, .sib-cal *::after { box-sizing: border-box; } /* Our own chrome is built from