*{box-sizing:border-box}
:root{
  --brand:#FF8057;
  --brand-dark:#E9673F;
  --brand-deep:#5B3425;
  --brand-deeper:#402319;
  --brand-soft:#FFF0E8;
  --brand-pale:#FFF8F4;
  --text:#292929;
  --muted:#67717A;
  --background:#F6F5F8;
  --white:#FFFFFF;
  --green:#188A40;
  --green-soft:#E8F6EC;
  --red:#B42318;
  --red-soft:#FDE8E6;
  --violet:#7E57A5;
  --violet-soft:#F1EAF7;
  --border:#E4DFDC;
}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{
  margin:0;
  font-family:"Nunito",Arial,sans-serif;
  background:var(--background);
  color:var(--text);
}
a{transition:.15s ease}
button,input,textarea,select{font:inherit}
h1,h2,h3,p{margin-top:0}
h1,h2,h3,strong{font-weight:900}
.handwritten{
  color:var(--brand-dark);
  font-size:12px;
  font-weight:900;
  letter-spacing:1px;
  text-transform:uppercase;
}
.small-handwritten{font-size:11px}
.big-handwritten{font-size:12px}
.muted{color:var(--muted)}

/* BUTTONS */
.btn,.tiny-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:0;
  padding:11px 15px;
  border-radius:9px;
  background:var(--brand);
  color:#fff;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
  box-shadow:none;
}
.btn:hover,.tiny-btn:hover{background:var(--brand-dark)}
.btn-light{
  background:#fff;
  color:var(--brand-deep);
  border:1px solid #D8D1CE;
}
.btn-light:hover{background:#FAF8F7}
.btn-primary{background:var(--brand)}
.btn-big{padding:13px 18px}
.btn-full{width:100%}

/* =========================================================
   SIGNED-IN NAV — SAME STRUCTURE/LANGUAGE AS REFERENCE HUB
========================================================= */
.app-shell{display:block;min-height:100vh}
.sidebar{
  min-height:76px;
  padding:12px 38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background:#fff;
  color:var(--text);
  border-bottom:1px solid rgba(0,0,0,.06);
  box-shadow:0 2px 15px rgba(0,0,0,.04);
  position:sticky;
  top:0;
  z-index:1000;
}
.sidebar-brand{
  display:flex;
  align-items:center;
  gap:14px;
  flex:0 0 auto;
  padding-right:24px;
  border-right:1px solid #DDD;
}
.sidebar-logo{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:var(--brand-soft);
  font-size:22px;
}
.sidebar-brand strong{
  display:block;
  color:var(--brand-deep);
  font-size:18px;
  font-weight:900;
}
.sidebar-brand small{
  display:block;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  letter-spacing:1px;
  text-transform:uppercase;
}
.sidebar-doodle{display:none}
.sidebar nav{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:3px;
}
.nav-item{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:10px 11px;
  border-radius:9px;
  color:#333;
  font-size:13px;
  font-weight:900;
  text-decoration:none;
  white-space:nowrap;
}
.nav-item:hover,.nav-item.active{
  background:var(--brand-soft);
  color:var(--brand-deep);
}
.sidebar-bottom{display:none}

/* =========================================================
   SIGNED-IN HERO + PAGE
========================================================= */
.app-main{
  min-height:calc(100vh - 76px);
  padding:0 0 70px;
  background:var(--background);
  overflow:visible;
}
.topbar{
  padding:60px 40px 78px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:30px;
  color:#fff;
  background:linear-gradient(110deg,var(--brand-deeper),#7B4834);
}
.topbar>div:first-child{
  width:min(760px,100%);
  margin-left:max(0px,calc((100vw - 1180px)/2));
}
.topbar h1{
  margin:5px 0 0;
  color:#fff;
  font-size:clamp(36px,5vw,54px);
  line-height:1.05;
  font-weight:900;
  letter-spacing:-1px;
}
.topbar p{
  max-width:700px;
  margin:17px 0 0;
  font-size:17px;
  line-height:1.6;
  color:rgba(255,255,255,.92);
}
.topbar .handwritten{color:#FFD4C1}
.top-actions{
  margin-right:max(0px,calc((100vw - 1180px)/2));
  display:flex;
  align-items:center;
  gap:10px;
}
.user-pill{
  padding:10px 13px;
  border-radius:10px;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  font-size:12px;
  font-weight:900;
}
.topbar .btn-light{border:0}

/* Every page body below hero */
.app-main>.stats-grid,
.app-main>.dashboard-grid,
.app-main>.panel,
.app-main>.cute-banner,
.app-main>.cards-grid,
.app-main>.pet-directory,
.app-main>.finance-grid,
.app-main>.calendar-toolbar,
.app-main>.legend-row,
.app-main>.month-calendar,
.app-main>.calendar-bottom-grid,
.app-main>.timeline,
.app-main>.enquiry-manager-grid,
.app-main>.section-title,
.app-main>section:not(.topbar){
  max-width:1180px;
  width:calc(100% - 52px);
  margin-left:auto;
  margin-right:auto;
}
.topbar+.stats-grid,
.topbar+.dashboard-grid,
.topbar+.panel,
.topbar+.cards-grid,
.topbar+.pet-directory,
.topbar+.finance-grid,
.topbar+.calendar-toolbar,
.topbar+.enquiry-manager-grid,
.topbar+.section-title,
.topbar+section{
  position:relative;
  z-index:2;
  margin-top:-30px;
}

/* =========================================================
   CARDS
========================================================= */
.panel{
  margin-bottom:22px;
  padding:25px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.06);
}
.panel-heading{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  margin-bottom:18px;
}
.panel h2{
  margin:3px 0 0;
  color:var(--brand-deep);
  font-size:21px;
}
.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin-bottom:20px;
}
.stat-card{
  display:flex;
  align-items:center;
  gap:14px;
  padding:20px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.06);
}
.stat-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--brand-soft);
  font-size:22px;
}
.stat-card span,.stat-card strong,.stat-card small{display:block}
.stat-card span{font-size:12px;color:var(--muted);font-weight:800}
.stat-card strong{margin:1px 0;font-size:25px;color:var(--brand-deep)}
.stat-card small{font-size:11px;color:var(--muted);font-weight:700}
.dashboard-grid{
  display:grid;
  grid-template-columns:1.65fr .75fr;
  gap:20px;
}
.quick-actions{display:grid;gap:9px;margin-top:18px}
.quick-action{
  display:grid;
  grid-template-columns:40px 1fr auto;
  align-items:center;
  gap:11px;
  padding:11px;
  border:1px solid #EEEAF0;
  border-radius:11px;
  background:#fff;
  color:inherit;
  text-decoration:none;
}
.quick-action:hover{background:#FAF9FA}
.quick-icon{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--brand-soft);
}
.quick-action strong,.quick-action small{display:block}
.quick-action strong{font-size:13px}
.quick-action small{margin-top:2px;font-size:11px;color:var(--muted)}
.cute-banner{
  padding:18px 22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-radius:16px;
  background:var(--brand-soft);
  color:var(--brand-deep);
  border:1px solid #FFDFD0;
}
.cute-banner strong,.cute-banner span{display:block}
.cute-banner span{margin-top:3px;color:#7C5C4E;font-size:12px}
.banner-dog{font-size:44px}

/* =========================================================
   FORMS — DIRECTLY MIRRORS REFERENCE PROJECT
========================================================= */
.form-panel,.public-form-panel{
  padding:25px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.06);
}
.form-panel-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  margin-bottom:18px;
}
.form-mascot{display:none}
.form-grid,.pretty-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px;
}
.form,.pretty-form{display:block}
.form-section{
  padding:0 0 24px;
  margin:0;
  background:transparent;
  border:0;
  box-shadow:none;
}
.form-section+.form-section{
  padding-top:24px;
  border-top:1px solid #EEEAF0;
}
.form-section-title{margin-bottom:10px}
.form-section-title>span{display:none}
.form-section-title strong{
  display:block;
  color:var(--brand-deep);
  font-size:16px;
}
.form-section-title small{
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:12px;
}
.form-grid label:not(.check),
.form label:not(.check),
.pretty-field{
  display:block;
  margin:14px 0 6px;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  color:var(--text);
  font-size:13px;
  font-weight:900;
}
.pretty-field>span{
  display:block;
  margin:0 0 6px;
  padding:0;
  font-size:13px;
  font-weight:900;
  color:var(--text);
}
.form-grid input,
.form-grid textarea,
.form-grid select,
.form input,
.form textarea,
.form select,
.pretty-field input,
.pretty-field textarea,
.pretty-field select{
  width:100%;
  margin:0;
  padding:11px 12px;
  border:1px solid #D8D1DF;
  border-radius:9px;
  background:#fff;
  color:var(--text);
  font:inherit;
  font-size:15px;
  outline:none;
  box-shadow:none;
}
.form-grid textarea,.form textarea,.pretty-field textarea{
  min-height:110px;
  resize:vertical;
}
.form-grid input:focus,
.form-grid textarea:focus,
.form-grid select:focus,
.form input:focus,
.form textarea:focus,
.form select:focus,
.pretty-field input:focus,
.pretty-field textarea:focus,
.pretty-field select:focus{
  border-color:#FF9B77;
  box-shadow:0 0 0 3px rgba(255,128,87,.12);
}
.form-grid input::placeholder,
.form-grid textarea::placeholder,
.form input::placeholder,
.form textarea::placeholder,
.pretty-field input::placeholder,
.pretty-field textarea::placeholder{
  color:#A59EA3;
}
.span-2,.pretty-field.pretty-area{grid-column:1/-1}
.checkbox-field{
  grid-column:1/-1;
  margin-top:14px;
  padding:16px;
  border:1px solid #E3DDE8;
  border-radius:13px;
  background:#FAF9FB;
}
.checkbox-field legend{
  padding:0 5px;
  font-size:13px;
  font-weight:900;
}
.checkbox-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
.check{
  display:flex!important;
  align-items:center;
  gap:9px!important;
  min-height:44px;
  margin:0!important;
  padding:9px 11px!important;
  border:1px solid #E5E0E7!important;
  border-radius:9px!important;
  background:#fff!important;
  font-size:12px!important;
}
.check input{
  width:16px!important;
  height:16px!important;
  margin:0!important;
  padding:0!important;
  accent-color:var(--brand);
}
.form-actions,.public-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:20px;
}
.form-actions>span,.public-actions>span{
  color:var(--muted);
  font-size:12px;
}

/* =========================================================
   TABLES
========================================================= */
.table-wrap{
  overflow:auto;
  border:1px solid #E9E4EA;
  border-radius:12px;
}
table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
  font-size:13px;
}
th{
  padding:12px;
  text-align:left;
  background:#FAF9FB;
  color:#5F5762;
  border-bottom:1px solid #E9E4EA;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.5px;
}
td{
  padding:13px 12px;
  border-bottom:1px solid #EFEAF0;
  vertical-align:top;
}
tr:last-child td{border-bottom:0}
.status,.finance-status{
  display:inline-flex;
  padding:5px 8px;
  border-radius:999px;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font-size:10px;
  font-weight:900;
  text-transform:capitalize;
}
.inline-form{display:flex;align-items:center;gap:6px}
.inline-form select{
  padding:7px 8px;
  border:1px solid #D8D1DF;
  border-radius:8px;
  background:#fff;
}

/* =========================================================
   PETS / GENERAL DETAIL CARDS
========================================================= */
.cards-grid,.pet-directory{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-bottom:20px;
}
.pet-card,.pretty-pet-card,.care-card{
  padding:20px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.06);
}
.pet-photo,.pet-portrait{
  width:88px;
  height:88px;
  object-fit:cover;
  display:block;
  border-radius:12px;
}
.pet-photo.placeholder{
  display:grid;
  place-items:center;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font-size:28px;
  font-weight:900;
}
.pet-card h3,.pretty-pet-card h3,.care-card h3{
  margin:9px 0 3px;
  color:var(--brand-deep);
}
.pet-card p,.pet-card small,.care-card p{
  color:var(--muted);
  font-size:12px;
}
.pet-note{
  margin-top:10px;
  padding:11px;
  border-radius:10px;
  background:#FAF9FB;
  font-size:12px;
}
.pet-note strong,.pet-note span{display:block}
.pet-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:10px;
}
.pet-chip-row span{
  padding:5px 8px;
  border-radius:999px;
  background:#FAF9FB;
  border:1px solid #EAE5EB;
  color:#605860;
  font-size:10px;
  font-weight:800;
}
.detail-list{display:grid;gap:0}
.detail-list>div{
  display:grid;
  grid-template-columns:145px 1fr;
  gap:15px;
  padding:10px 0;
  border-bottom:1px solid #EEEAF0;
}
.detail-list span{color:var(--muted);font-size:12px;font-weight:800}
.detail-list strong{font-size:12px}
.detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}

/* =========================================================
   ENQUIRIES / FINANCE / OFFER CARDS
========================================================= */
.enquiry-manager-grid,.finance-grid,.offer-grid,.owner-invoice-grid,.calendar-bottom-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.manager-enquiry-card,.finance-card,.offer-card,.payout-card,.owner-invoice-card{
  padding:20px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.06);
}
.enquiry-card-top,.finance-card-top,.offer-top{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
}
.enquiry-facts,.offer-details{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}
.enquiry-note{
  margin-top:12px;
  padding:12px;
  border-radius:10px;
  background:#FAF9FB;
}
.finance-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}

/* =========================================================
   CALENDAR
========================================================= */
.calendar-toolbar{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:24px;
  padding:18px 20px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.06);
}
.calendar-toolbar h2{margin:3px 0;font-size:25px;color:var(--brand-deep)}
.calendar-nav{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:9px;
  border:1px solid #D8D1DF;
  background:#fff;
  color:var(--brand-deep);
  text-decoration:none;
  font-weight:900;
}
.legend-row{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
  margin-top:14px!important;
  margin-bottom:14px!important;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}
.legend-row span{display:flex;align-items:center;gap:5px}
.legend-dot{width:9px;height:9px;border-radius:50%}
.booking-dot{background:var(--brand)}
.available-dot{background:#5DA877}
.unavailable-dot{background:#D96A6A}
.preferred-dot{background:#9C72B6}
.month-calendar{
  overflow:hidden;
  border-radius:18px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.06);
  margin-bottom:20px;
}
.calendar-weekdays,.calendar-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
}
.calendar-weekdays>div{
  padding:12px;
  text-align:center;
  background:#FAF9FB;
  color:#5F5762;
  border-bottom:1px solid #E9E4EA;
  font-size:11px;
  font-weight:900;
}
.calendar-day{
  min-height:145px;
  padding:9px;
  background:#fff;
  border-top:1px solid #EFEAF0;
  border-right:1px solid #EFEAF0;
}
.calendar-day.outside{background:#FBFAFB}
.calendar-day-number{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#F4F1F4;
  color:var(--brand-deep);
  font-size:11px;
  font-weight:900;
}
.calendar-events{display:grid;gap:4px;margin-top:7px}
.cal-event{
  padding:6px 7px;
  border-radius:7px;
  font-size:10px;
  line-height:1.25;
}
.cal-event strong,.cal-event span{display:block}
.cal-event span{margin-top:2px;opacity:.78}
.cal-event.booking{background:#FFF0E8;border-left:3px solid var(--brand)}
.cal-event.available{background:var(--green-soft);border-left:3px solid #62A97A}
.cal-event.unavailable{background:var(--red-soft);border-left:3px solid #D96A6A}
.cal-event.preferred{background:var(--violet-soft);border-left:3px solid var(--violet)}
.more-events{padding-left:3px;font-size:10px;color:var(--muted);font-weight:900}
.availability-list{display:grid;gap:8px;margin-top:15px}
.availability-pill{
  padding:10px 12px;
  border-radius:10px;
  font-size:11px;
}
.availability-pill strong,.availability-pill span,.availability-pill small{display:block}
.availability-pill.available{background:var(--green-soft)}
.availability-pill.unavailable{background:var(--red-soft)}
.availability-pill.preferred{background:var(--violet-soft)}

/* =========================================================
   PUBLIC ENQUIRY PAGE — SAME SUBPAGE PATTERN AS REFERENCE
========================================================= */
.luna-public-nav{
  min-height:76px;
  padding:12px max(38px,calc((100vw - 1180px)/2));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.06);
  box-shadow:0 2px 15px rgba(0,0,0,.04);
  position:sticky;
  top:0;
  z-index:1000;
}
.luna-public-brand{
  display:flex;
  align-items:center;
  gap:14px;
  color:var(--text);
  text-decoration:none;
}
.luna-public-logo{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:var(--brand-soft);
  font-size:22px;
}
.luna-public-brand strong{display:block;color:var(--brand-deep);font-size:18px}
.luna-public-brand small{
  display:block;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
  letter-spacing:1px;
  text-transform:uppercase;
}
.luna-public-nav nav{display:flex;align-items:center;gap:5px}
.luna-public-nav nav a{
  padding:10px 12px;
  border-radius:9px;
  color:#333;
  font-size:13px;
  font-weight:900;
  text-decoration:none;
}
.luna-public-nav nav a:hover,.luna-public-nav nav a.active{
  background:var(--brand-soft);
  color:var(--brand-deep);
}
.luna-public-nav nav .nav-login{
  margin-left:7px;
  background:var(--brand);
  color:#fff;
}
.luna-sub-hero{
  padding:60px 40px 78px;
  color:#fff;
  background:linear-gradient(110deg,var(--brand-deeper),#7B4834);
}
.luna-sub-hero-inner{max-width:1180px;margin:auto}
.luna-hero-tag{
  display:inline-block;
  margin-bottom:14px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.17);
  font-size:12px;
  font-weight:900;
  letter-spacing:1px;
  text-transform:uppercase;
}
.luna-sub-hero h1{
  margin:0;
  font-size:clamp(36px,5vw,54px);
  line-height:1.05;
  font-weight:900;
  letter-spacing:-1px;
}
.luna-sub-hero p{
  max-width:700px;
  margin:17px 0 0;
  font-size:18px;
  line-height:1.6;
  color:rgba(255,255,255,.92);
}
.luna-sub-page{
  max-width:1180px;
  margin:-30px auto 70px;
  padding:0 26px;
  position:relative;
}
.luna-info{
  max-width:900px;
  margin-bottom:18px;
  padding:15px 17px;
  border-radius:13px;
  background:var(--brand-soft);
  color:#71412E;
  line-height:1.5;
  box-shadow:0 7px 24px rgba(0,0,0,.05);
}
.luna-form-card{
  max-width:900px;
  padding:28px;
  background:#fff;
  border-radius:20px;
  box-shadow:0 8px 28px rgba(0,0,0,.07);
}
.luna-form-intro{margin-bottom:22px}
.luna-form-intro span{
  color:var(--brand-dark);
  font-size:11px;
  font-weight:900;
  letter-spacing:1px;
  text-transform:uppercase;
}
.luna-form-intro h2{
  margin:4px 0 3px;
  color:var(--brand-deep);
  font-size:25px;
}
.luna-form-intro p{margin:0;color:var(--muted);font-size:13px}
.luna-form-section{
  padding:22px 0;
  border-top:1px solid #EEEAF0;
}
.luna-form-section h3{
  margin:0 0 2px;
  color:var(--brand-deep);
  font-size:16px;
}
.luna-form-section>p{
  margin:0;
  color:var(--muted);
  font-size:12px;
}
.luna-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px;
}
.luna-grid label{
  display:block;
  margin:14px 0 6px;
  font-size:13px;
  font-weight:900;
}
.luna-grid input,.luna-grid textarea,.luna-grid select{
  width:100%;
  padding:11px 12px;
  border:1px solid #D8D1DF;
  border-radius:9px;
  background:#fff;
  color:var(--text);
  font:inherit;
  font-size:15px;
  outline:none;
}
.luna-grid textarea{min-height:110px;resize:vertical}
.luna-grid input:focus,.luna-grid textarea:focus,.luna-grid select:focus{
  border-color:#FF9B77;
  box-shadow:0 0 0 3px rgba(255,128,87,.12);
}
.luna-wide{grid-column:1/-1}
.luna-form-actions{
  padding-top:20px;
  display:flex;
  justify-content:flex-end;
}
.luna-button{
  border:0;
  padding:11px 15px;
  border-radius:9px;
  background:var(--brand);
  color:#fff;
  font:inherit;
  font-weight:900;
  cursor:pointer;
}
.luna-button:hover{background:var(--brand-dark)}

/* =========================================================
   LANDING / LOGIN / PORTALS
========================================================= */
.landing{
  min-height:100vh;
  width:min(1180px,90%);
  margin:auto;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:50px;
  align-items:center;
  padding:55px 0;
}
.landing h1{
  margin:10px 0 20px;
  color:var(--brand-deep);
  font-size:clamp(48px,7vw,88px);
  line-height:.88;
  letter-spacing:-2px;
}
.landing h1 span{display:block;color:var(--brand)}
.landing-copy>p{
  max-width:600px;
  color:var(--muted);
  font-size:16px;
  line-height:1.65;
}
.mini-location{
  display:inline-block;
  padding:7px 11px;
  border-radius:999px;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font-size:11px;
  font-weight:900;
}
.landing-pills{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}
.landing-pills span{
  padding:7px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid #E8E2E0;
  font-size:11px;
  font-weight:800;
}
.landing-card{
  min-height:500px;
  padding:28px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 28px rgba(0,0,0,.07);
}
.dog-shape{flex:1;display:grid;place-items:center}
.dog-emoji{font-size:170px}
.speech-bubble{
  padding:20px;
  border-radius:14px;
  background:var(--brand-soft);
}
.speech-bubble strong,.speech-bubble small{display:block}
.speech-bubble small{margin-top:4px;color:var(--muted)}
.doodle{display:none}

.auth-wrap{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:30px;
  background:var(--background);
}
.auth-card{
  width:min(460px,100%);
  padding:28px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 28px rgba(0,0,0,.07);
}
.brand-bubble{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:var(--brand-soft);
  font-size:22px;
  margin-bottom:18px;
}
.auth-title{
  margin:5px 0 7px;
  color:var(--brand-deep);
  font-size:32px;
}
.auth-title span{color:var(--brand)}
.auth-subtitle{margin-bottom:20px;color:var(--muted);line-height:1.5}
.alert{
  margin-bottom:16px;
  padding:12px;
  border-radius:10px;
  background:var(--red-soft);
  color:#8F1F1F;
  font-size:12px;
  font-weight:800;
}
.paw-float{display:none}
.security-note,.tiny-note{
  margin-top:15px;
  color:var(--muted);
  font-size:11px;
}
.portal-page{
  width:min(1100px,92%);
  margin:auto;
  padding:25px 0 60px;
}
.portal-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:20px;
}
.portal-brand strong{color:var(--brand-deep);font-size:20px}
.portal-hero{
  margin-bottom:20px;
  padding:28px;
  border-radius:18px;
  background:linear-gradient(110deg,var(--brand-deeper),#7B4834);
  color:#fff;
}
.portal-hero h1{margin:5px 0;color:#fff;font-size:38px}
.portal-hero p{margin:5px 0;color:rgba(255,255,255,.9)}
.portal-hero .handwritten{color:#FFD4C1}
.portal-bookings{display:grid;gap:12px}
.booking-card{
  display:grid;
  grid-template-columns:52px 1fr auto;
  gap:14px;
  align-items:center;
  padding:16px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.05);
  text-decoration:none;
  color:inherit;
}
.booking-card-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--brand-soft);
}
.booking-card h3{margin:3px 0;color:var(--brand-deep)}
.booking-card p,.booking-card small{margin:0;color:var(--muted);font-size:11px}
.booking-arrow{font-size:20px;color:var(--brand)}

/* MISC */
.copy-box{
  margin-top:10px;
  padding:12px;
  border-radius:9px;
  border:1px solid #E3DDE8;
  background:#FAF9FB;
}
code{word-break:break-all}
.empty-state{
  padding:38px 20px;
  text-align:center;
  color:var(--muted);
}
.empty-state h3{margin:5px 0;color:var(--brand-deep)}
.empty-dog{font-size:42px}
.section-title{margin-bottom:12px}
.section-title h2{margin:3px 0;color:var(--brand-deep)}
.timeline{display:grid;gap:12px}
.timeline-item{
  display:grid;
  grid-template-columns:75px 16px 1fr;
  gap:10px;
  align-items:start;
}
.timeline-date{
  padding-top:14px;
  text-align:right;
  color:var(--brand-deep);
  font-size:12px;
  font-weight:900;
}
.timeline-dot{
  width:10px;
  height:10px;
  margin-top:17px;
  border-radius:50%;
  background:var(--brand);
}
.timeline-card{
  padding:15px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.05);
}
.timeline-card h3{margin:3px 0;color:var(--brand-deep)}
.timeline-card p,.timeline-card small{margin:0;color:var(--muted);font-size:11px}

/* =========================================================
   RESPONSIVE
========================================================= */
@media(max-width:1100px){
  .sidebar{padding:12px 20px;gap:14px}
  .sidebar-brand{padding-right:14px}
  .nav-item{padding:9px 8px;font-size:12px}
  .nav-item span{display:none}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-grid{grid-template-columns:1fr}
  .cards-grid,.pet-directory{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:850px){
  .sidebar{
    position:relative;
    flex-wrap:wrap;
    padding:12px 18px;
  }
  .sidebar-brand{border-right:0}
  .sidebar nav{
    order:2;
    flex-basis:100%;
    justify-content:flex-start;
    overflow-x:auto;
  }
  .nav-item span{display:inline}
  .topbar{
    display:block;
    padding:42px 22px 68px;
  }
  .topbar>div:first-child{margin-left:0}
  .top-actions{margin:18px 0 0}
  .form-grid,.pretty-grid,.luna-grid{grid-template-columns:1fr}
  .span-2,.pretty-field.pretty-area,.luna-wide{grid-column:auto}
  .checkbox-grid{grid-template-columns:1fr}
  .enquiry-manager-grid,.finance-grid,.offer-grid,.owner-invoice-grid,.calendar-bottom-grid,.detail-grid{grid-template-columns:1fr}
  .landing{grid-template-columns:1fr}
  .luna-public-nav{padding:12px 18px}
  .luna-public-nav nav a:not(.nav-login){display:none}
  .luna-sub-hero{padding:44px 22px 70px}
  .luna-sub-page{padding:0 18px}
  .luna-form-card{padding:22px}
}
@media(max-width:600px){
  .stats-grid,.cards-grid,.pet-directory{grid-template-columns:1fr}
  .app-main>.stats-grid,
  .app-main>.dashboard-grid,
  .app-main>.panel,
  .app-main>.cute-banner,
  .app-main>.cards-grid,
  .app-main>.pet-directory,
  .app-main>.finance-grid,
  .app-main>.calendar-toolbar,
  .app-main>.legend-row,
  .app-main>.month-calendar,
  .app-main>.calendar-bottom-grid,
  .app-main>.timeline,
  .app-main>.enquiry-manager-grid,
  .app-main>.section-title,
  .app-main>section:not(.topbar){
    width:calc(100% - 28px);
  }
  .calendar-day{min-height:105px;padding:5px}
  .cal-event{font-size:9px;padding:5px}
  .landing h1{font-size:54px}
}

/* MANAGE USERS */
.notice-banner{
  max-width:1180px;
  width:calc(100% - 52px);
  margin:-30px auto 18px;
  position:relative;
  z-index:3;
  padding:14px 17px;
  border-radius:13px;
  background:#E8F6EC;
  color:#155E2E;
  box-shadow:0 7px 24px rgba(0,0,0,.05);
  font-size:13px;
  font-weight:800;
}
.user-stats{
  max-width:1180px;
  width:calc(100% - 52px);
  margin:-30px auto 20px;
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:15px;
}
.user-summary-card{
  display:flex;
  align-items:center;
  gap:13px;
  padding:18px;
  border-radius:16px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.06);
}
.user-summary-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font-size:18px;
  font-weight:900;
}
.user-summary-card strong,
.user-summary-card span{display:block}
.user-summary-card strong{
  color:var(--brand-deep);
  font-size:23px;
}
.user-summary-card span{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}
.info-box{
  margin-bottom:18px;
  padding:15px 17px;
  border-radius:13px;
  background:var(--brand-soft);
  color:#70412E;
  line-height:1.5;
  font-size:13px;
}
.user-create-form{display:block}
.count-badge{
  padding:6px 9px;
  border-radius:999px;
  background:#F1EDF2;
  color:#645B67;
  font-size:10px;
  font-weight:900;
}
.users-list{display:grid;gap:14px}
.managed-user-card{
  border:1px solid #E8E3E7;
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}
.managed-user-head{
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center;
  gap:13px;
  padding:16px 18px;
  background:#FAF9FB;
  border-bottom:1px solid #EBE6EC;
}
.managed-user-avatar{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font-size:18px;
  font-weight:900;
}
.managed-user-name>div{
  display:flex;
  align-items:center;
  gap:7px;
}
.managed-user-name strong{
  color:var(--brand-deep);
  font-size:15px;
}
.managed-user-name>span{
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:11px;
}
.you-badge{
  padding:3px 6px;
  border-radius:999px;
  background:#EAF2FF;
  color:#173F72;
  font-size:9px;
  font-weight:900;
}
.managed-user-badges{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.role-badge,.account-badge{
  padding:5px 8px;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
}
.role-manager{background:#F1EAF7;color:#694482}
.role-sitter{background:#FFF0E8;color:#7A412B}
.role-owner{background:#EAF2FF;color:#173F72}
.account-badge.active{background:#E8F6EC;color:#155E2E}
.account-badge.inactive{background:#FDE8E6;color:#8F1F1F}
.managed-user-body{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
}
.managed-user-section{
  padding:17px 18px;
  border-right:1px solid #EEEAF0;
}
.managed-user-section:nth-child(2){border-right:0}
.managed-user-section-head{
  margin-bottom:12px;
}
.managed-user-section-head strong,
.managed-user-section-head span{display:block}
.managed-user-section-head strong{
  color:var(--brand-deep);
  font-size:12px;
}
.managed-user-section-head span{
  margin-top:2px;
  color:var(--muted);
  font-size:10px;
}
.mini-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.mini-grid label{
  display:block;
  margin:0;
  color:var(--text);
  font-size:11px;
  font-weight:900;
}
.mini-grid input,
.password-row input{
  width:100%;
  margin-top:5px;
  padding:9px 10px;
  border:1px solid #D8D1DF;
  border-radius:8px;
  background:#fff;
  font:inherit;
  font-size:12px;
  outline:none;
}
.mini-grid input:focus,
.password-row input:focus{
  border-color:#FF9B77;
  box-shadow:0 0 0 3px rgba(255,128,87,.10);
}
.small-action{
  margin-top:10px;
  padding:8px 10px;
  border:0;
  border-radius:8px;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font:inherit;
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}
.small-action:hover{background:#FFE2D5}
.password-row{
  display:flex;
  align-items:flex-end;
  gap:8px;
}
.password-row input{margin-top:0}
.password-row .small-action{
  flex:0 0 auto;
  margin-top:0;
  padding:10px 12px;
}
.managed-user-footer{
  grid-column:1/-1;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  padding:13px 18px;
  background:#FCFBFC;
  border-top:1px solid #EEEAF0;
}
.managed-user-footer>div{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.managed-user-footer small{
  color:var(--muted);
  font-size:10px;
}
.managed-user-footer a{
  color:var(--brand-dark);
  font-size:10px;
  font-weight:900;
}
.self-note{
  color:var(--muted);
  font-size:10px;
  font-weight:800;
}
.toggle-user{
  padding:8px 10px;
  border:0;
  border-radius:8px;
  font:inherit;
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}
.toggle-user.disable{background:#FDE8E6;color:#8F1F1F}
.toggle-user.enable{background:#E8F6EC;color:#155E2E}
@media(max-width:950px){
  .user-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .managed-user-body{grid-template-columns:1fr}
  .managed-user-section{border-right:0;border-bottom:1px solid #EEEAF0}
}
@media(max-width:650px){
  .user-stats{grid-template-columns:1fr}
  .managed-user-head{grid-template-columns:44px 1fr}
  .managed-user-badges{grid-column:1/-1;justify-content:flex-start}
  .mini-grid{grid-template-columns:1fr}
  .managed-user-footer{align-items:flex-start;flex-direction:column}
  .password-row{align-items:stretch;flex-direction:column}
  .password-row .small-action{width:100%}
}


/* =========================================================
   OWNER PROFILE / PET ACCESS / PUBLIC INVOICE
========================================================= */
.owner-profile-notice{
  margin:0 auto 18px;
  width:min(1100px,92%);
  padding:13px 16px;
  border-radius:10px;
  font-size:12px;
  font-weight:900;
}
.owner-profile-notice.success{background:var(--green-soft);color:#155E2E}
.owner-profile-notice.error{background:var(--red-soft);color:#8F1F1F}
.owner-profile-panel{margin-top:0}
.pet-access-panel{margin-top:22px}
.access-list{
  display:grid;
  gap:8px;
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid #EEEAF0;
}
.access-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 14px;
  border:1px solid #E8E3E7;
  border-radius:10px;
  background:#FAF9FB;
}
.access-row strong,.access-row span,.access-row small{display:block}
.access-row strong{color:var(--brand-deep);font-size:13px}
.access-row span{margin-top:2px;color:#554B50;font-size:11px;font-weight:800}
.access-row small{margin-top:2px;color:var(--muted);font-size:10px}
.ongoing-pet-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-bottom:25px;
}
.ongoing-pet-card{
  display:grid;
  grid-template-columns:62px 1fr auto;
  gap:13px;
  align-items:center;
  padding:14px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.05);
  color:inherit;
  text-decoration:none;
}
.ongoing-pet-card img,.ongoing-pet-avatar{
  width:58px;
  height:58px;
  border-radius:11px;
  object-fit:cover;
}
.ongoing-pet-avatar{
  display:grid;
  place-items:center;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font-size:20px;
  font-weight:900;
}
.ongoing-pet-card strong,.ongoing-pet-card span,.ongoing-pet-card small{display:block}
.ongoing-pet-card strong{color:var(--brand-deep)}
.ongoing-pet-card span{margin-top:2px;color:#554B50;font-size:11px;font-weight:800}
.ongoing-pet-card small{margin-top:3px;color:var(--muted);font-size:10px}
.ongoing-pet-card b{color:var(--brand-dark);font-size:10px}
.pet-profile-link{
  display:inline-block;
  margin:0 0 10px;
  color:var(--brand-dark);
  font-size:10px;
  font-weight:900;
  text-decoration:none;
}
.pet-profile-heading{
  display:flex;
  align-items:center;
  gap:18px;
}
.sitter-pet-photo{
  width:88px;
  height:88px;
  border-radius:15px;
  object-fit:cover;
  border:3px solid rgba(255,255,255,.25);
}
.sitter-pet-placeholder{
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.16);
  color:#fff;
  font-size:28px;
  font-weight:900;
}
.access-banner{
  margin-bottom:20px;
  padding:14px 17px;
  border-radius:12px;
  background:#E8F6EC;
  color:#155E2E;
}
.access-banner strong,.access-banner span{display:block}
.access-banner span{margin-top:2px;font-size:11px;font-weight:800}
.access-banner p{margin:7px 0 0;font-size:12px}
.care-profile-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.care-profile-block{
  padding:14px;
  border-radius:11px;
  border:1px solid #E9E4EA;
  background:#FAF9FB;
}
.care-profile-block strong{display:block;color:var(--brand-deep);font-size:12px}
.care-profile-block p{margin:5px 0 0;color:#51494D;font-size:12px;line-height:1.5}
.visit-history{display:grid;gap:8px}
.visit-history-row{
  display:grid;
  grid-template-columns:180px 1fr;
  gap:16px;
  padding:12px 0;
  border-bottom:1px solid #EEEAF0;
}
.visit-history-row:last-child{border-bottom:0}
.visit-history-row strong,.visit-history-row span{display:block}
.visit-history-row strong{font-size:12px;color:var(--brand-deep)}
.visit-history-row span{margin-top:2px;color:var(--muted);font-size:10px}
.visit-history-row p{margin:0;font-size:12px;line-height:1.5}
.public-link-box{
  margin-top:12px;
  padding:10px 12px;
  border-radius:9px;
  background:#FAF9FB;
  border:1px solid #E3DDE8;
}
.public-link-box span{display:block;margin-bottom:4px;color:var(--muted);font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.6px}
.public-link-box code{font-size:10px}
.owner-invoice-link{margin-top:12px;width:100%}

/* Public invoice */
.public-invoice-page{
  width:min(920px,92%);
  margin:0 auto;
  padding:24px 0 60px;
}
.public-invoice-nav{
  min-height:66px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:22px;
}
.public-invoice-card{
  padding:34px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 28px rgba(0,0,0,.07);
}
.public-invoice-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:25px;
  padding-bottom:25px;
  border-bottom:1px solid #E9E4EA;
}
.invoice-kicker{
  display:block;
  margin-bottom:5px;
  color:var(--brand-dark);
  font-size:10px;
  font-weight:900;
  letter-spacing:1px;
}
.public-invoice-head h1{
  margin:0;
  color:var(--brand-deep);
  font-size:35px;
}
.public-invoice-head p{margin:4px 0 0;color:var(--muted)}
.public-invoice-status{
  padding:8px 11px;
  border-radius:999px;
  font-size:10px;
  font-weight:900;
}
.public-invoice-status.released{background:#FFF0E8;color:#75402B}
.public-invoice-status.paid{background:#E8F6EC;color:#155E2E}
.public-invoice-meta{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  padding:25px 0;
}
.public-invoice-meta span,.public-invoice-meta strong{display:block}
.public-invoice-meta span{
  margin-bottom:4px;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  letter-spacing:.5px;
  text-transform:uppercase;
}
.public-invoice-meta strong{font-size:12px}
.public-invoice-total{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:22px;
  border-radius:14px;
  background:var(--brand-soft);
  color:var(--brand-deep);
}
.public-invoice-total span{font-size:13px;font-weight:900}
.public-invoice-total strong{font-size:30px}
.public-invoice-notes{
  margin-top:18px;
  padding:15px;
  border-radius:11px;
  background:#FAF9FB;
}
.public-invoice-notes p{margin:5px 0 0;color:#51494D;font-size:12px}
.public-invoice-footer{
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid #E9E4EA;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
}
@media(max-width:760px){
  .ongoing-pet-grid,.care-profile-grid,.public-invoice-meta{grid-template-columns:1fr}
  .ongoing-pet-card{grid-template-columns:54px 1fr}
  .ongoing-pet-card b{grid-column:2}
  .visit-history-row{grid-template-columns:1fr;gap:5px}
  .access-row{align-items:flex-start;flex-direction:column}
  .public-invoice-card{padding:22px}
  .public-invoice-head{flex-direction:column}
  .public-invoice-footer{flex-direction:column;gap:4px}
}
@page{
  size:A4;
  margin:14mm;
}
@media print{
  html,body{
    background:#fff!important;
    color:#222!important;
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
  }
  .public-invoice-nav{
    min-height:auto!important;
    margin:0 0 14mm!important;
    padding:0!important;
    box-shadow:none!important;
    border:0!important;
    position:static!important;
  }
  .public-invoice-nav .print-button{display:none!important}
  .public-invoice-page{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
  }
  .public-invoice-card{
    width:100%!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    break-inside:avoid;
  }
  .public-invoice-head,
  .public-invoice-meta,
  .public-invoice-total,
  .public-invoice-notes,
  .public-invoice-footer{
    break-inside:avoid;
  }
  .public-invoice-head h1{font-size:28pt!important}
  .public-invoice-meta{
    grid-template-columns:repeat(3,1fr)!important;
    gap:10mm 8mm!important;
  }
  .public-invoice-total{
    border:1px solid #F3C6B5!important;
  }
  .public-invoice-footer{
    margin-top:16mm!important;
  }
  a{
    color:inherit!important;
    text-decoration:none!important;
  }
}


/* OWNER PET PROFILE EDITING */
.pet-edit-button{
  width:100%;
  margin-top:14px;
}
.portal-hero.compact{
  padding:24px 28px;
}
.portal-hero.compact h1{
  font-size:34px;
}


/* PET PARENT EDIT BUTTON */
.owner-pet-card{
  display:flex;
  flex-direction:column;
}
.owner-pet-actions{
  margin-top:auto;
  padding-top:16px;
}
.owner-pet-actions .pet-edit-button{
  width:100%;
  min-height:44px;
  justify-content:center;
}


/* =========================================================
   PET UPDATES / SITTER STORY
========================================================= */
.sitter-update-panel{margin-top:22px}
.pet-update-form{margin-bottom:22px}
.sitter-update-feed,.owner-update-feed,.invoice-story-feed{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.pet-update-card{
  overflow:hidden;
  border:1px solid #E9E4EA;
  border-radius:16px;
  background:#fff;
}
.pet-update-photo-wrap{
  width:100%;
  aspect-ratio:16/10;
  overflow:hidden;
  background:#F4F1F4;
}
.pet-update-photo{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.pet-update-copy{padding:16px}
.pet-update-meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:7px;
}
.pet-update-meta span{
  color:var(--brand-dark);
  font-size:10px;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.pet-update-meta small{
  color:var(--muted);
  font-size:9px;
}
.pet-update-card h3{
  margin:0 0 6px;
  color:var(--brand-deep);
  font-size:17px;
}
.pet-update-mood{
  display:inline-flex;
  margin-bottom:8px;
  padding:5px 8px;
  border-radius:999px;
  background:var(--brand-soft);
  color:#71412E;
  font-size:10px;
  font-weight:900;
}
.pet-update-card p{
  margin:0;
  color:#50484C;
  font-size:12px;
  line-height:1.55;
}
.pet-update-card footer{
  margin-top:12px;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
}
.invoice-inclusion{
  display:block;
  margin-top:9px;
  color:#188A40;
  font-size:9px;
  font-weight:900;
}
.owner-updates-section{
  margin-bottom:22px;
}
.invoice-pet-story{
  margin-top:28px;
  padding-top:26px;
  border-top:1px solid #E9E4EA;
}
.invoice-story-heading{
  margin-bottom:16px;
}
.invoice-story-heading span{
  display:block;
  margin-bottom:4px;
  color:var(--brand-dark);
  font-size:10px;
  font-weight:900;
  letter-spacing:.7px;
  text-transform:uppercase;
}
.invoice-story-heading h2{
  margin:0 0 4px;
  color:var(--brand-deep);
  font-size:24px;
}
.invoice-story-heading p{
  margin:0;
  color:var(--muted);
  font-size:12px;
}
@media(max-width:760px){
  .sitter-update-feed,.owner-update-feed,.invoice-story-feed{grid-template-columns:1fr}
}
@media print{
  .invoice-pet-story{break-before:auto;break-inside:auto}
  .invoice-story-feed{
    grid-template-columns:1fr 1fr!important;
  }
  .pet-update-card{
    break-inside:avoid;
    box-shadow:none!important;
  }
  .pet-update-photo-wrap{
    aspect-ratio:16/9;
  }
}


/* =========================================================
   PHOTO UPLOAD + END OF SIT REVIEW
========================================================= */
.field-help{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:10px;
  font-weight:700;
}
.review-button{
  white-space:nowrap;
}
.end-review-page{
  width:min(1120px,94%);
  margin:0 auto;
  padding:22px 0 60px;
}
.end-review-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  margin-bottom:20px;
}
.end-review-toolbar>div{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
}
.end-review-document{
  overflow:hidden;
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 28px rgba(0,0,0,.07);
}
.end-review-cover{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
  padding:38px;
  color:#fff;
  background:linear-gradient(110deg,var(--brand-deeper),#7B4834);
}
.review-kicker{
  display:block;
  margin-bottom:7px;
  color:var(--brand-dark);
  font-size:10px;
  font-weight:900;
  letter-spacing:1px;
  text-transform:uppercase;
}
.end-review-cover .review-kicker{color:#FFD4C1}
.end-review-cover h1{
  margin:0;
  font-size:42px;
  line-height:1;
}
.end-review-cover p{
  margin:9px 0 0;
  color:rgba(255,255,255,.88);
}
.review-status{
  padding:8px 11px;
  border-radius:999px;
  background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.18);
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
}
.review-signoff{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  border-bottom:1px solid #E9E4EA;
}
.review-signoff>div{
  padding:18px 22px;
  border-right:1px solid #E9E4EA;
}
.review-signoff>div:last-child{border-right:0}
.review-signoff span,.review-signoff strong,.review-signoff small{display:block}
.review-signoff span{
  margin-bottom:4px;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.review-signoff strong{color:var(--brand-deep);font-size:14px}
.review-signoff small{margin-top:2px;color:#51494D;font-size:11px;font-weight:800}
.review-section{
  padding:30px 36px;
  border-bottom:1px solid #E9E4EA;
}
.review-section-head{
  display:flex;
  align-items:flex-start;
  gap:13px;
  margin-bottom:20px;
}
.review-section-head>span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:9px;
  background:var(--brand-soft);
  color:var(--brand-deep);
  font-size:11px;
  font-weight:900;
}
.review-section-head h2{margin:0;color:var(--brand-deep);font-size:22px}
.review-section-head p{margin:3px 0 0;color:var(--muted);font-size:11px}
.review-facts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.review-fact{
  min-width:0;
  padding:12px;
  border:1px solid #E9E4EA;
  border-radius:10px;
  background:#FAF9FB;
}
.review-fact span,.review-fact strong{display:block}
.review-fact span{
  margin-bottom:4px;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  letter-spacing:.5px;
  text-transform:uppercase;
}
.review-fact strong{
  overflow-wrap:anywhere;
  color:#423A3E;
  font-size:11px;
}
.review-text-block{
  margin-top:12px;
  padding:14px;
  border-radius:10px;
  background:#FAF9FB;
  border:1px solid #E9E4EA;
}
.review-text-block strong{display:block;color:var(--brand-deep);font-size:11px}
.review-text-block p{margin:5px 0 0;font-size:11px;line-height:1.55;color:#4E464A}
.review-pets{display:grid;gap:16px}
.review-pet{
  padding:20px;
  border:1px solid #E9E4EA;
  border-radius:14px;
  background:#fff;
}
.review-pet-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-bottom:15px;
}
.review-pet-head h3{margin:0;color:var(--brand-deep);font-size:22px}
.review-pet-head p{margin:3px 0 0;color:var(--muted);font-size:11px}
.review-pet-head img{
  width:72px;
  height:72px;
  object-fit:cover;
  border-radius:12px;
}
.review-update-feed{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.review-visits{display:grid;gap:0}
.review-visit{
  display:grid;
  grid-template-columns:210px 1fr;
  gap:18px;
  padding:14px 0;
  border-bottom:1px solid #EEEAF0;
}
.review-visit:last-child{border-bottom:0}
.review-visit-time strong,.review-visit-time span,.review-visit-time small{display:block}
.review-visit-time strong{color:var(--brand-deep);font-size:11px}
.review-visit-time span{margin-top:3px;color:#4E464A;font-size:10px;font-weight:800}
.review-visit-time small{margin-top:2px;color:var(--muted);font-size:9px}
.review-visit p{margin:0;font-size:11px;line-height:1.55}
.review-finance-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.review-finance-main,.review-payment-destination{
  padding:18px;
  border-radius:12px;
  background:var(--brand-soft);
  color:var(--brand-deep);
}
.review-finance-main span,.review-finance-main strong,.review-finance-main small,
.review-payment-destination span,.review-payment-destination strong{display:block}
.review-finance-main span,.review-payment-destination span{
  margin-bottom:5px;
  font-size:9px;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.review-finance-main strong{font-size:27px}
.review-finance-main small{margin-top:3px;font-size:10px;color:#71412E}
.review-payment-destination strong{font-size:20px}
.review-payment-destination p{margin:5px 0 0;font-size:13px;font-weight:900}
.review-payouts{
  margin-top:16px;
  padding:16px;
  border:1px solid #E9E4EA;
  border-radius:12px;
}
.review-payouts h3{margin:0 0 10px;color:var(--brand-deep);font-size:14px}
.review-payout-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:9px 0;
  border-top:1px solid #EEEAF0;
}
.review-payout-row strong,.review-payout-row span{display:block}
.review-payout-row strong{font-size:11px}
.review-payout-row span{margin-top:2px;color:var(--muted);font-size:9px}
.review-empty{color:var(--muted);font-size:11px}
.review-footer{
  display:grid;
  gap:4px;
  padding:22px 36px;
  background:#FAF9FB;
  color:var(--muted);
  font-size:9px;
}
.review-footer strong{color:var(--brand-deep);font-size:11px}
@media(max-width:760px){
  .review-signoff,.review-facts,.review-finance-grid,.review-update-feed{grid-template-columns:1fr}
  .review-visit{grid-template-columns:1fr;gap:6px}
  .end-review-cover{flex-direction:column}
  .review-section{padding:24px 20px}
  .end-review-toolbar{align-items:stretch;flex-direction:column}
}
@media print{
  @page{size:A4;margin:12mm}
  .no-print{display:none!important}
  .end-review-page{
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  .end-review-document{
    border-radius:0!important;
    box-shadow:none!important;
  }
  .end-review-cover{
    padding:20px!important;
  }
  .end-review-cover h1{font-size:26pt!important}
  .review-section{
    padding:16px 18px!important;
    break-inside:auto;
  }
  .review-section-head,
  .review-pet,
  .review-visit,
  .review-finance-grid,
  .review-payout-row,
  .pet-update-card{
    break-inside:avoid;
  }
  .review-facts{
    grid-template-columns:repeat(3,1fr)!important;
  }
  .review-signoff{
    grid-template-columns:repeat(3,1fr)!important;
  }
  .review-update-feed{
    grid-template-columns:repeat(2,1fr)!important;
  }
  .review-footer{
    padding:14px 18px!important;
  }
}


/* =========================================================
   PRINT PHOTO QUALITY
========================================================= */
@media print{
  .pet-update-card{
    display:block!important;
    overflow:visible!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
    border:1px solid #DDD!important;
    border-radius:10px!important;
  }

  .pet-update-photo-wrap{
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    overflow:visible!important;
    background:#fff!important;
    break-inside:avoid!important;
  }

  .pet-update-photo{
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    height:auto!important;
    max-height:120mm!important;
    margin:0 auto!important;
    object-fit:contain!important;
    object-position:center!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }

  .review-pet-head img,
  .sitter-pet-photo,
  .pet-photo,
  .pet-portrait{
    object-fit:contain!important;
    background:#fff!important;
  }

  .review-update-feed,
  .invoice-story-feed{
    align-items:start!important;
  }

  .review-update-feed .pet-update-card,
  .invoice-story-feed .pet-update-card{
    width:100%!important;
    max-width:100%!important;
  }

  .review-update-feed .pet-update-copy,
  .invoice-story-feed .pet-update-copy{
    padding:10px 12px!important;
  }

  .review-update-feed .pet-update-photo,
  .invoice-story-feed .pet-update-photo{
    max-height:85mm!important;
  }

  .public-invoice-card img,
  .end-review-document img{
    image-rendering:auto!important;
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
  }
}



/* =========================================================
   PRINT PHOTO EMBEDDING / PDF FIDELITY
========================================================= */
@media print{
  .pet-update-photo-wrap{
    display:block!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
    background:#fff!important;
    text-align:center!important;
  }

  .pet-update-photo{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-height:95mm!important;
    object-fit:contain!important;
    object-position:center!important;
    margin:0 auto!important;
    border-radius:0!important;
  }

  .invoice-story-feed,
  .review-update-feed{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:7mm!important;
  }

  .invoice-story-feed .pet-update-card,
  .review-update-feed .pet-update-card{
    display:grid!important;
    grid-template-columns:minmax(0, 44%) minmax(0, 56%)!important;
    align-items:start!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }

  .invoice-story-feed .pet-update-card:not(:has(.pet-update-photo-wrap)),
  .review-update-feed .pet-update-card:not(:has(.pet-update-photo-wrap)){
    display:block!important;
  }

  .invoice-story-feed .pet-update-photo-wrap,
  .review-update-feed .pet-update-photo-wrap{
    height:100%!important;
    min-height:45mm!important;
    max-height:82mm!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  .invoice-story-feed .pet-update-photo,
  .review-update-feed .pet-update-photo{
    width:100%!important;
    height:100%!important;
    max-height:82mm!important;
    object-fit:contain!important;
  }

  .invoice-story-feed .pet-update-copy,
  .review-update-feed .pet-update-copy{
    min-width:0!important;
    padding:5mm!important;
  }
}


/* =========================================================
   PET UPDATE IMAGE DISPLAY FIX
========================================================= */
.pet-update-photo-wrap{
  min-height:0;
}
.pet-update-photo{
  display:block;
  width:100%;
  height:auto;
  max-height:460px;
  object-fit:contain;
  background:#F7F4F6;
}
.pet-update-photo:not([src]),
.pet-update-photo[src=""]{
  display:none;
}


/* =========================================================
   FULL INVOICE MAKER
========================================================= */
.invoice-maker-launch{
  display:flex;
  width:100%;
  justify-content:center;
  margin:14px 0 2px;
}
.invoice-maker-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:20px;
}
.invoice-maker-summary>div{
  min-width:0;
  padding:16px;
  border-radius:13px;
  background:#fff;
  box-shadow:0 7px 24px rgba(0,0,0,.05);
}
.invoice-maker-summary span,.invoice-maker-summary strong,.invoice-maker-summary small{display:block}
.invoice-maker-summary span{
  margin-bottom:5px;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.invoice-maker-summary strong{color:var(--brand-deep);font-size:17px}
.invoice-maker-summary small{margin-top:4px;color:var(--muted);font-size:9px}
.invoice-line-table-wrap{
  overflow-x:auto;
  margin-bottom:20px;
}
.invoice-line-table{
  width:100%;
  min-width:760px;
  border-collapse:collapse;
}
.invoice-line-table th{
  padding:10px 11px;
  border-bottom:1px solid #DDD6DC;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  letter-spacing:.5px;
  text-align:left;
  text-transform:uppercase;
}
.invoice-line-table td{
  padding:12px 11px;
  border-bottom:1px solid #EEEAF0;
  vertical-align:top;
  font-size:11px;
}
.invoice-line-table td strong,.invoice-line-table td small{display:block}
.invoice-line-table td small{margin-top:3px;color:var(--muted)}
.invoice-item-builder{
  display:grid;
  grid-template-columns:minmax(180px,2fr) minmax(180px,2fr) repeat(4,minmax(100px,1fr));
  gap:12px;
  align-items:end;
  padding:18px;
  border-radius:13px;
  background:#FAF9FB;
  border:1px solid #E9E4EA;
}
.invoice-item-builder label{margin:0}
.invoice-item-add{
  grid-column:1/-1;
}
.invoice-total-box{
  width:min(430px,100%);
  margin:20px 0 0 auto;
  padding:16px;
  border-radius:13px;
  background:#FAF9FB;
  border:1px solid #E9E4EA;
}
.invoice-total-box>div{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:6px 0;
}
.invoice-total-box span{color:var(--muted);font-size:11px;font-weight:800}
.invoice-total-box strong{color:var(--brand-deep);font-size:13px}
.invoice-total-box .grand-total{
  margin-top:7px;
  padding-top:12px;
  border-top:1px solid #DDD6DC;
}
.invoice-total-box .grand-total span{color:var(--brand-deep);font-size:13px}
.invoice-total-box .grand-total strong{font-size:23px}
.invoice-maker-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.invoice-action-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  justify-content:flex-end;
}
.tiny-btn.danger{
  color:#9A2F2F;
  border-color:#E8CACA;
  background:#FFF7F7;
}

/* public detailed invoice */
.invoice-customer-ref{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
}
.invoice-bill-to{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  padding:24px 0;
  border-bottom:1px solid #E9E4EA;
}
.invoice-bill-to span{
  display:block;
  margin-bottom:6px;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.invoice-bill-to strong{display:block;color:var(--brand-deep);font-size:13px}
.invoice-bill-to p{margin:4px 0 0;color:#51494D;font-size:11px;line-height:1.5}
.public-invoice-lines{
  overflow-x:auto;
  margin:24px 0 8px;
}
.public-invoice-lines table{
  width:100%;
  min-width:650px;
  border-collapse:collapse;
}
.public-invoice-lines th{
  padding:9px 10px;
  border-bottom:2px solid #DED7DD;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  text-align:right;
  text-transform:uppercase;
}
.public-invoice-lines th:first-child{text-align:left}
.public-invoice-lines td{
  padding:12px 10px;
  border-bottom:1px solid #EEEAF0;
  font-size:11px;
  text-align:right;
  vertical-align:top;
}
.public-invoice-lines td:first-child{text-align:left}
.public-invoice-lines td strong,.public-invoice-lines td small{display:block}
.public-invoice-lines td small{margin-top:3px;color:var(--muted)}
.invoice-totals-breakdown{
  width:min(360px,100%);
  margin:14px 0 14px auto;
}
.invoice-totals-breakdown>div{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:5px 0;
}
.invoice-totals-breakdown span{color:var(--muted);font-size:10px;font-weight:800}
.invoice-totals-breakdown strong{font-size:11px}
@media(max-width:900px){
  .invoice-maker-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .invoice-item-builder{grid-template-columns:repeat(2,minmax(0,1fr))}
  .invoice-item-description,.invoice-item-detail{grid-column:1/-1}
}
@media(max-width:650px){
  .invoice-maker-summary,.invoice-bill-to{grid-template-columns:1fr}
  .invoice-item-builder{grid-template-columns:1fr}
  .invoice-item-description,.invoice-item-detail,.invoice-item-add{grid-column:1}
  .invoice-maker-actions{align-items:stretch;flex-direction:column}
  .invoice-action-buttons{justify-content:stretch}
  .invoice-action-buttons>*{flex:1 1 auto}
}
@media print{
  .public-invoice-lines{overflow:visible!important}
  .public-invoice-lines table{min-width:0!important}
  .public-invoice-lines th,.public-invoice-lines td{padding:7px 6px!important}
  .invoice-bill-to{grid-template-columns:1fr 1fr!important}
}


/* =========================================================
   CLICKABLE CARDS / RECORD DRILL-IN
========================================================= */
.clickable-card{
  display:block;
  color:inherit;
  text-decoration:none;
  cursor:pointer;
}
.clickable-card-wrap{
  position:relative;
  cursor:pointer;
}
.card-overlay-link{
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
}
.clickable-card-wrap a:not(.card-overlay-link),
.clickable-card-wrap button,
.clickable-card-wrap form,
.clickable-card-wrap input,
.clickable-card-wrap select{
  position:relative;
  z-index:2;
}
.clickable-card,
.clickable-card-wrap{
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
@media (hover:hover) and (pointer:fine){
  .clickable-card:hover,
  .clickable-card-wrap:hover{
    transform:translateY(-2px);
    box-shadow:0 11px 28px rgba(0,0,0,.08);
  }
}
.clickable-card:focus-visible,
.card-overlay-link:focus-visible,
.table-primary-link:focus-visible,
.table-link:focus-visible,
.clickable-row:focus-visible{
  outline:3px solid rgba(255,101,64,.28);
  outline-offset:3px;
}
.table-primary-link,.table-link{
  color:var(--brand-deep);
  text-decoration:none;
  font-weight:800;
}
.table-link{color:#594C52}
.clickable-list{
  display:grid;
  gap:8px;
}
.clickable-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:13px 14px;
  border:1px solid #E9E4EA;
  border-radius:10px;
  background:#FAF9FB;
  color:inherit;
  text-decoration:none;
}
.clickable-row>div{min-width:0}
.clickable-row strong,.clickable-row span,.clickable-row b{display:block}
.clickable-row strong{color:var(--brand-deep);font-size:12px}
.clickable-row span{margin-top:2px;color:var(--muted);font-size:10px}
.clickable-row b{color:var(--brand-dark);font-size:10px}
@media (hover:hover) and (pointer:fine){
  .clickable-row:hover{border-color:#D8C8CE;background:#fff}
}
.visit-row-static{cursor:default}


/* =========================================================
   PET INFORMATION FORM
========================================================= */
.pet-card-actions{
  position:relative;
  z-index:2;
  margin-top:14px;
}
.pet-card-actions .btn{
  width:100%;
  justify-content:center;
}
.pet-info-page{
  width:min(1120px,94%);
  margin:0 auto;
  padding:22px 0 60px;
}
.pet-info-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  margin-bottom:20px;
}
.pet-info-document{
  overflow:hidden;
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 28px rgba(0,0,0,.07);
}
.pet-info-cover{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:26px;
  padding:36px;
  background:linear-gradient(110deg,var(--brand-deeper),#7B4834);
  color:#fff;
}
.pet-info-cover .review-kicker{color:#FFD4C1}
.pet-info-cover h1{
  margin:0;
  font-size:42px;
  line-height:1;
}
.pet-info-cover p{
  margin:9px 0 0;
  color:rgba(255,255,255,.88);
}
.pet-info-hero-photo{
  width:112px;
  height:112px;
  flex:0 0 auto;
  border-radius:16px;
  object-fit:cover;
  border:3px solid rgba(255,255,255,.22);
}
.pet-info-meta{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border-bottom:1px solid #E9E4EA;
}
.pet-info-meta>div{
  padding:16px 20px;
  border-right:1px solid #E9E4EA;
}
.pet-info-meta>div:last-child{border-right:0}
.pet-info-meta span,.pet-info-meta strong{display:block}
.pet-info-meta span{
  margin-bottom:4px;
  color:var(--muted);
  font-size:9px;
  font-weight:900;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.pet-info-meta strong{
  color:var(--brand-deep);
  font-size:12px;
}
@media(max-width:760px){
  .pet-info-meta{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pet-info-cover{align-items:flex-start;flex-direction:column}
  .pet-info-toolbar{align-items:stretch;flex-direction:column}
}
@media print{
  .pet-info-page{
    width:100%!important;
    margin:0!important;
    padding:0!important;
  }
  .pet-info-document{
    border-radius:0!important;
    box-shadow:none!important;
  }
  .pet-info-cover{
    padding:20px!important;
  }
  .pet-info-cover h1{font-size:26pt!important}
  .pet-info-meta{
    grid-template-columns:repeat(4,1fr)!important;
  }
  .pet-info-hero-photo{
    width:26mm!important;
    height:26mm!important;
    object-fit:contain!important;
    background:#fff!important;
  }
  .no-print-link-style{
    color:inherit!important;
    text-decoration:none!important;
  }
}


/* =========================================================
   MANAGER PET CARD CLICK FIX
========================================================= */
.manager-pet-card{
  position:relative;
}
.manager-pet-overlay-link{
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
}
.manager-pet-card > *:not(.manager-pet-overlay-link){
  position:relative;
  z-index:2;
  pointer-events:none;
}
.manager-pet-card .pet-card-actions{
  pointer-events:auto;
}
.manager-pet-card .pet-card-actions a,
.manager-pet-card .pet-card-actions button{
  position:relative;
  z-index:3;
  pointer-events:auto;
}
.manager-pet-card:hover{
  cursor:pointer;
}