:root{--navy:#173b57;--blue:#2f78a8;--soft:#eef6fa;--ink:#183042;--muted:#6d7d89;--border:#dfe8ed}body{background:#f5f8fa;color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}.app-navbar{background:linear-gradient(120deg,#13354f,#245f82);box-shadow:0 5px 24px rgba(10,43,65,.13)}.app-navbar .nav-link{border-radius:10px;margin:0 2px}.app-navbar .nav-link.active,.app-navbar .nav-link:hover{background:rgba(255,255,255,.13)}.login-shell{min-height:100vh;background:radial-gradient(circle at top left,#d8edf6,transparent 45%),linear-gradient(135deg,#edf7fb,#dcebf2)}.login-card{max-width:1050px;width:100%;min-height:590px;border-radius:28px}.login-visual{background:linear-gradient(rgba(9,43,63,.35),rgba(9,43,63,.88)),url('https://images.unsplash.com/photo-1450778869180-41d0601e046e?auto=format&fit=crop&w=1400&q=80') center/cover}.btn-primary{--bs-btn-bg:#2d759f;--bs-btn-border-color:#2d759f;--bs-btn-hover-bg:#205e82;--bs-btn-hover-border-color:#205e82}.hero-panel{background:linear-gradient(115deg,#fff,#eaf5fa);border:1px solid var(--border);border-radius:24px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;font-weight:800;color:var(--blue)}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.page-heading h1{font-weight:750;margin:.2rem 0}.page-heading p{color:var(--muted);margin:0}.app-card{border:1px solid var(--border);border-radius:18px;box-shadow:0 7px 24px rgba(17,61,86,.05);overflow:hidden}.app-card .card-header{background:#fff;padding:1rem 1.25rem;border-color:var(--border)}.metric-card{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--border);border-radius:18px;padding:22px;height:100%;box-shadow:0 7px 24px rgba(17,61,86,.05)}.metric-icon{display:grid;place-items:center;width:50px;height:50px;border-radius:16px;background:var(--soft);color:var(--blue);font-size:1.4rem}.metric-value{font-size:1.8rem;font-weight:800}.metric-label{color:var(--muted);font-size:.9rem}.pet-tile{display:flex;gap:14px;align-items:center;padding:16px;border:1px solid var(--border);border-radius:15px;transition:.2s}.pet-tile:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(17,61,86,.08)}.pet-avatar{display:grid;place-items:center;min-width:48px;width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#54a5c8,#2e6c94);color:#fff;font-size:1.2rem;font-weight:800}.pet-avatar-lg{width:68px;height:68px;font-size:1.6rem}.pet-avatar-xl{width:84px;height:84px;font-size:2rem}.empty-state{text-align:center;padding:48px 24px;color:var(--muted)}.empty-state i{display:block;font-size:2.5rem;color:#8fb8cc;margin-bottom:12px}.bg-soft{background:var(--soft)!important}.record-box{background:#f8fafb;border:1px solid var(--border);border-radius:14px;padding:14px;height:100%}.record-box small{font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:.08em}.record-box p{margin:.5rem 0 0}.status-pill{display:inline-block;padding:.35rem .65rem;border-radius:999px;font-size:.75rem;font-weight:700;background:#e7edf0}.status-requested{background:#fff2cc;color:#805c00}.status-confirmed{background:#dff2ff;color:#075985}.status-in_service{background:#e8e2ff;color:#5540a7}.status-completed{background:#dcfce7;color:#166534}.status-cancelled,.status-no_show{background:#fee2e2;color:#991b1b}.notification-icon{display:grid;place-items:center;min-width:44px;height:44px;border-radius:14px;background:var(--soft);color:var(--blue);font-size:1.2rem}.code-sample{background:#102d40;color:#d8edf7;border-radius:14px;padding:18px;font-size:.78rem;white-space:pre-wrap}.table thead th{background:#f7fafb;color:#60717e;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;border-bottom-width:1px}.table td,.table th{padding:1rem 1.1rem}.form-control,.form-select{border-color:#cfdae0;border-radius:10px;padding:.7rem .85rem}.form-control:focus,.form-select:focus{border-color:#4f94b8;box-shadow:0 0 0 .2rem rgba(47,120,168,.13)}@media(max-width:991px){.page-heading{align-items:flex-start;flex-direction:column}.page-heading>.btn,.page-heading>div:last-child{width:100%}.login-card{min-height:auto}}