/* PetsRegistry dashboard theme: a cleaner, more professional look for the
   admin panel and the member dashboard. Loaded after the main stylesheet.
   body.pr-admin / body.pr-member are set by the small script in index.html. */

/* ---------- utilities the compiled stylesheet does not include ---------- */
.gap-x-5{column-gap:1.25rem}.py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.w-\[150px\]{width:150px}
.border-green-500{border-color:#22c55e}.hover\:bg-muted\/30:hover{background-color:hsl(var(--muted)/.3)}
@media (min-width:768px){.md\:hidden{display:none}.md\:flex-row{flex-direction:row}.md\:items-end{align-items:flex-end}.md\:justify-between{justify-content:space-between}}
@media (min-width:1024px){.lg\:flex-row{flex-direction:row}.lg\:items-center{align-items:center}.lg\:justify-between{justify-content:space-between}.lg\:w-80{width:20rem}}

/* ---------- shared ---------- */
body.pr-app{--pr-canvas:220 27% 97%;--pr-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.07);--pr-shadow-lg:0 4px 12px rgba(16,24,40,.08),0 2px 4px rgba(16,24,40,.04)}
.dark body.pr-app,body.pr-app.dark{--pr-canvas:222 47% 6%}
body.pr-app #root main{background:hsl(var(--pr-canvas))}
@media (min-width:768px){body.pr-app #root main{padding:2rem 2.5rem 3rem}}

/* page titles */
body.pr-app #root main h1{font-size:1.75rem;line-height:1.2;letter-spacing:-.02em;font-weight:700}
body.pr-app #root main h1+p{margin-top:.35rem;font-size:.9rem}
body.pr-app #root main h2{letter-spacing:-.01em}

/* cards */
body.pr-app #root main .rounded-lg.border.bg-card,body.pr-app #root main .rounded-xl.border.bg-card{border-radius:14px;border-color:hsl(var(--border));box-shadow:var(--pr-shadow)}
body.pr-app #root main .rounded-lg.border.bg-card.hover\:shadow-md:hover,body.pr-app #root main a:hover>.rounded-lg.border.bg-card{box-shadow:var(--pr-shadow-lg);transform:translateY(-1px)}
body.pr-app #root main .rounded-lg.border.bg-card{transition:box-shadow .15s,transform .15s}

/* tables */
body.pr-app #root main table{border-collapse:separate;border-spacing:0}
body.pr-app #root main thead th{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;font-weight:600;color:hsl(var(--muted-foreground));background:hsl(var(--muted)/.55);border-bottom:1px solid hsl(var(--border));white-space:nowrap}
body.pr-app #root main tbody tr{transition:background-color .12s}
body.pr-app #root main tbody tr:hover{background:hsl(var(--primary)/.035)}
body.pr-app #root main tbody td{border-bottom:1px solid hsl(var(--border)/.7)}
body.pr-app #root main tbody tr:last-child td{border-bottom:0}

/* form controls */
body.pr-app #root main input:not([type=checkbox]):not([type=radio]):not([type=range]),body.pr-app #root main select,body.pr-app #root main textarea,body.pr-app #root main button[role=combobox]{border-radius:9px}
body.pr-app #root main input:focus-visible,body.pr-app #root main select:focus-visible,body.pr-app #root main textarea:focus-visible{outline:none;box-shadow:0 0 0 3px hsl(var(--primary)/.18);border-color:hsl(var(--primary)/.6)}
body.pr-app #root main button.rounded-md,body.pr-app #root main a.rounded-md{border-radius:9px}
body.pr-app #root main button.bg-primary,body.pr-app #root main a.bg-primary{box-shadow:0 1px 2px rgba(16,24,40,.12),inset 0 1px 0 rgba(255,255,255,.12)}

/* tabs */
body.pr-app #root main [role=tablist]{border-radius:10px;padding:4px}
body.pr-app #root main [role=tab][data-state=active]{box-shadow:var(--pr-shadow)}

/* sidebars: stay in view while the page scrolls */
body.pr-app #root .flex.min-h-screen>aside.w-64{position:sticky;top:0;height:100vh;flex-shrink:0}
body.pr-app #root aside.w-64 nav{scrollbar-width:thin}
body.pr-app #root aside.w-64 nav a{font-size:.9rem;border-radius:9px;padding:.55rem .75rem;position:relative}
body.pr-app #root aside.w-64 nav a svg{width:1.1rem;height:1.1rem;opacity:.85}

/* ---------- admin: dark navy sidebar ---------- */
body.pr-admin #root .flex.min-h-screen>aside.w-64{background:#0f1a2b;border-right:0;color:#c7d0dd}
body.pr-admin #root aside.w-64>div:first-child{border-bottom:1px solid rgba(255,255,255,.08);height:auto;padding:14px 16px}
body.pr-admin #root aside.w-64>div:first-child img{background:#fff;border-radius:10px;padding:6px 10px;height:46px;width:auto;box-shadow:0 1px 3px rgba(0,0,0,.25)}
body.pr-admin #root aside.w-64 nav{padding:12px}
body.pr-admin #root aside.w-64 nav a{color:#aab6c8}
body.pr-admin #root aside.w-64 nav a:hover{background:rgba(255,255,255,.06);color:#fff}
body.pr-admin #root aside.w-64 nav a.bg-primary\/10{background:linear-gradient(90deg,hsl(var(--primary)),hsl(175 70% 32%));color:#fff;box-shadow:0 2px 8px hsl(var(--primary)/.35)}
body.pr-admin #root aside.w-64 nav a.bg-primary\/10 svg{opacity:1}
body.pr-admin #root aside.w-64>div.border-t{border-top:1px solid rgba(255,255,255,.08)}
body.pr-admin #root aside.w-64>div.border-t button{color:#c7d0dd}
body.pr-admin #root aside.w-64>div.border-t button:hover{background:rgba(255,255,255,.08);color:#fff}
body.pr-admin #root aside.w-64 nav::-webkit-scrollbar{width:6px}
body.pr-admin #root aside.w-64 nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:3px}
body.pr-admin #root aside.w-64 .pr-nav-group{margin:14px 12px 4px;font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#6f7f96}

/* ---------- member: light sidebar with brand logo ---------- */
body.pr-member #root .flex.min-h-screen>aside.w-64{background:hsl(var(--card));border-right:1px solid hsl(var(--border));box-shadow:1px 0 0 rgba(16,24,40,.02)}
body.pr-member #root aside.w-64 nav a{color:hsl(var(--muted-foreground))}
body.pr-member #root aside.w-64 nav a:hover{background:hsl(var(--muted));color:hsl(var(--foreground))}
body.pr-member #root aside.w-64 nav a.bg-primary\/10{background:hsl(var(--primary)/.09);color:hsl(var(--primary));font-weight:600}
body.pr-member #root aside.w-64 nav a.bg-primary\/10::before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:hsl(var(--primary))}
body.pr-member #root aside.w-64 .pr-logo{height:40px;width:auto;display:block}
body.pr-member #root aside.w-64 .pr-nav-group{margin:14px 12px 4px;font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:hsl(var(--muted-foreground)/.75)}

/* ---------- top bar added inside each dashboard page ---------- */
.pr-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-.5rem 0 1.5rem;padding-bottom:1rem;border-bottom:1px solid hsl(var(--border))}
.pr-crumbs{font-size:.8rem;color:hsl(var(--muted-foreground))}
.pr-crumbs b{color:hsl(var(--foreground));font-weight:600}
.pr-user{display:flex;align-items:center;gap:10px;font-size:.82rem;color:hsl(var(--muted-foreground))}
.pr-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem;color:#fff;background:linear-gradient(135deg,#931894,#0b86c8)}
@media (max-width:767px){.pr-topbar{display:none}}

/* print: hide navigation so pages print cleanly */
@media print{body.pr-app #root aside,.pr-topbar{display:none!important}body.pr-app #root main{padding:0!important;background:#fff!important}}