/* beta-extra.css — the few rules the Go pages need that the beta build does not contain. Keep tiny. */
summary::-webkit-details-marker{display:none}
/* a native <select> dressed as the beta's SelectTrigger */
.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}
.pl-3{padding-left:calc(var(--spacing)*3)}
/* the chosen option of a radio card */
.has-\[\:checked\]\:border-primary:has(:checked){border-color:var(--primary)}
.has-\[\:checked\]\:bg-primary\/5:has(:checked){background-color:color-mix(in oklab,var(--primary) 5%,transparent)}
/* beta dialogs on a native <dialog> — the shadcn DialogContent look */
dialog.bdlg{position:fixed;inset:0;margin:auto;width:calc(100% - 2rem);max-width:32rem;max-height:85vh;overflow-y:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--background);color:var(--foreground);padding:1.5rem;box-shadow:0 10px 15px -3px rgb(0 0 0/.1),0 4px 6px -4px rgb(0 0 0/.1)}
dialog.bdlg-sm{max-width:24rem}dialog.bdlg-md{max-width:28rem}dialog.bdlg-lg{max-width:32rem}dialog.bdlg-xl{max-width:36rem}dialog.bdlg-2xl{max-width:42rem}dialog.bdlg-3xl{max-width:48rem}
dialog.bdlg::backdrop{background:rgb(0 0 0/.5)}
dialog.bdlg[open]{animation:bdlg-in .15s ease-out}
@keyframes bdlg-in{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:none}}
/* AI assistant widget */
[data-ui=beta] .ai-fab{position:fixed;right:1.25rem;bottom:calc(9.5rem + env(safe-area-inset-bottom));z-index:30;border-radius:9999px;padding:.6rem 1rem;background:#4f46e5;color:#fff;font-size:.875rem;font-weight:500;box-shadow:0 10px 15px -3px rgb(0 0 0/.1)}
@media (min-width:48rem){[data-ui=beta] .ai-fab{bottom:5rem}}
[data-ui=beta] .ai-box{position:fixed;right:1rem;bottom:1rem;z-index:50;width:min(24rem,calc(100vw - 2rem));max-height:70vh;display:flex;flex-direction:column;border:1px solid var(--border);border-radius:var(--radius);background:var(--background);box-shadow:0 10px 15px -3px rgb(0 0 0/.15)}
[data-ui=beta] .ai-head{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;border-bottom:1px solid var(--border);font-size:.875rem}
[data-ui=beta] .ai-log{flex:1;overflow:auto;padding:.75rem 1rem;font-size:.875rem;display:flex;flex-direction:column;gap:.5rem}
[data-ui=beta] .ai-form{display:flex;gap:.5rem;padding:.75rem;border-top:1px solid var(--border)}
[data-ui=beta] .ai-form textarea{flex:1;min-height:2.5rem;border:1px solid var(--input);border-radius:calc(var(--radius) - 2px);padding:.4rem .6rem;font-size:.875rem;background:transparent}
[data-ui=beta] .ai-note{padding:0 1rem .75rem;font-size:.75rem;color:var(--muted-foreground)}
[data-ui=beta] .ai-form .btn{border-radius:calc(var(--radius) - 2px);background:var(--primary);color:var(--primary-foreground);padding:0 .75rem;font-size:.875rem}
/* the theme toggle's moon/sun, and the phone bar's home-indicator gap */
.dark\:hidden:is(.dark *){display:none}
.dark\:block:is(.dark *){display:block}
.pb-\[env\(safe-area-inset-bottom\)\]{padding-bottom:env(safe-area-inset-bottom)}
/* the keyboard-highlighted row of any data-results list (ui.js) */
[data-ui=beta] .result.hi,[data-ui=beta] .hi[role=option]{background:var(--accent);color:var(--accent-foreground)}
/* server-drawn charts (internal/web/charts) in the beta's colours */
:root{--chart-grid:color-mix(in oklab,var(--border) 70%,transparent);--chart-base:var(--border);--chart-axis:var(--muted-foreground)}
.chart{width:100%;height:auto;display:block}
svg .ax{font-size:10.5px;fill:var(--muted-foreground);font-family:inherit}
.donut-svg{width:100%;max-width:160px;height:auto;margin-inline:auto}
.donut-big{font-size:18px;font-weight:600;fill:var(--foreground)}
.donut-sub{font-size:10px;fill:var(--muted-foreground)}
/* ui.js's "Skip to content" link: hidden until a keyboard user tabs to it */
[data-ui=beta] .skip-link{position:absolute;left:-9999px;top:.5rem;z-index:100;border-radius:var(--radius);background:var(--primary);color:var(--primary-foreground);padding:.5rem .75rem;font-size:.875rem}
[data-ui=beta] .skip-link:focus{left:.5rem}
/* thin, theme-coloured scrollbars (the sidebar list and other scroll areas) */
[data-ui=beta] *{scrollbar-width:thin;scrollbar-color:var(--border) transparent}
/* Conflicting utilities: the beta's cn()/tailwind-merge keeps the LAST class of a
   group (btn "sm" gap-1.5 over the base gap-2, an icon button's size-7 over size-9,
   badge colours over border-transparent, a tinted card's bg over bg-card); our
   joined class lists keep both and beta.css order decides. Two-class selectors put
   the intended value back. */
.border-transparent.border-border{border-color:var(--border)}
.gap-2.gap-1\.5{gap:calc(var(--spacing) * 1.5)}
.w-full.w-auto{width:auto}
.size-9.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}
.rounded-md.rounded-full{border-radius:3.40282e38px}
.h-9.h-8{height:calc(var(--spacing) * 8)}
.border-transparent.border-emerald-600\/50{border-color:#00976780}
@supports (color:color-mix(in lab,red,red)){.border-transparent.border-emerald-600\/50{border-color:color-mix(in oklab,var(--color-emerald-600) 50%,transparent)}}
.text-foreground.text-emerald-600{color:var(--color-emerald-600)}
.bg-card.bg-amber-500\/5{background-color:#f99c000d}
@supports (color:color-mix(in lab,red,red)){.bg-card.bg-amber-500\/5{background-color:color-mix(in oklab,var(--color-amber-500) 5%,transparent)}}
.h-8.h-7{height:calc(var(--spacing) * 7)}
.size-9.size-7{width:calc(var(--spacing) * 7);height:calc(var(--spacing) * 7)}
.h-8.h-6{height:calc(var(--spacing) * 6)}
.px-3.px-2{padding-inline:calc(var(--spacing) * 2)}
.w-full.w-20{width:calc(var(--spacing) * 20)}
.border-transparent.border-amber-500{border-color:var(--color-amber-500)}
.border-border.border-amber-500{border-color:var(--color-amber-500)}
.text-foreground.text-amber-600{color:var(--color-amber-600)}
.gap-2.gap-1{gap:calc(var(--spacing) * 1)}
.gap-1\.5.gap-1{gap:calc(var(--spacing) * 1)}
.px-3.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}
.border-transparent.border-amber-500\/40{border-color:color-mix(in oklab,var(--color-amber-500) 40%,transparent)}
.border-transparent.border-emerald-600\/40{border-color:color-mix(in oklab,var(--color-emerald-600) 40%,transparent)}
.text-card-foreground.text-amber-700{color:var(--color-amber-700)}
.text-card-foreground.dark\:text-amber-500:is(.dark *){color:var(--color-amber-500)}
/* two utilities the beta's build doesn't carry (found by the exact-match
   class check): the landing header's laptop link row and a zero padding */
.py-0{padding-block:calc(var(--spacing)*0)}
@media (width>=64rem){.lg\:flex{display:flex}}
/* the phone app (Play payments policy, App Store 3.1.1): nothing that leads
   to buying a plan — marked [data-purchase], plan/billing links, checkout
   forms. The server answers those routes with a notice too (store_app.go). */
html[data-app] [data-purchase],html[data-app] a[href="/app/plan"],html[data-app] a[href^="/app/plan?"],html[data-app] a[href^="/app/plan/"],html[data-app] a[href="/dealer/billing"],html[data-app] a[href^="/dealer/billing?"],html[data-app] a[href^="/dealer/billing/"],html[data-app] form[action*="/checkout"],html[data-app] a[href="#pricing"],html[data-app] a[href*="celonix.in/#pricing"],html[data-app] a[href="/pricing"],html[data-app] a[href^="/pricing?"],html[data-app] a[href^="/pricing#"],html[data-app] a[href$="celonix.in/pricing"],html[data-app] a[href$="#pricing"]{display:none!important}
/* round floating buttons (New sale, Cash out, New job…) sit over the page's
   bottom-right corner: give the page room so its last rows scroll clear of
   them. Their tops: one 68px / two 128px up (desktop); on phones one 136px /
   two 200px up, over the bottom bar (main already keeps 6rem for that bar). */
main:has(.fixed.size-12.rounded-full){padding-bottom:calc(9rem + env(safe-area-inset-bottom))}
main:has(.fixed.size-12.rounded-full~.fixed.size-12.rounded-full){padding-bottom:calc(13rem + env(safe-area-inset-bottom))}
@media (width>=48rem){main:has(.fixed.size-12.rounded-full){padding-bottom:5rem}main:has(.fixed.size-12.rounded-full~.fixed.size-12.rounded-full){padding-bottom:9rem}}
