/* Haro PetShop: restrained surfaces, warm accents, original logo pending. */
body { font-family: 'Source Sans Pro', system-ui, sans-serif; }
.content-wrapper { background: #fff9f1; }
.card { border-radius: 12px; box-shadow: 0 3px 14px #1717170b; }
.main-header { border-bottom: 3px solid #ffd12d; }
.main-sidebar .brand-link { color: #ffd12d !important; border-bottom: 1px solid #ffffff22; }
.main-sidebar .brand-text { font-weight: 700 !important; }
.nav-sidebar .nav-link { border-radius: 8px; }
.btn { border-radius: 7px; }
.btn-secondary, .btn-secondary-custom, .bg-secondary, .badge-secondary { color: #171717 !important; }
.login-page { background: radial-gradient(ellipse at top left, #fff1d2, #fff9f1 65%) !important; padding: 24px; }
.login-box { width: min(420px, 100%); }
.login-logo a { flex-direction: column; gap: 12px; color: #171717 !important; }
.login-logo .fa-paw { color: #b94700; }
.login-logo b { font-size: 34px; font-weight: 800; letter-spacing: -1px; }
.login-logo img { max-width: 160px; max-height: 160px; object-fit: contain; }
.haro-welcome-logo { width: 110px; height: 110px; object-fit: contain; flex-shrink: 0; }
@media (max-width: 575px) { .haro-welcome-logo { width: 72px; height: 72px; } }
.login-box > .card { border-top: 5px solid #f47708; overflow: hidden; box-shadow: 0 16px 48px #6b350f15; }
.login-card-body { padding: 30px; }
.login-box-msg { color: #665b51; }
.login-card-body .form-control { min-height: 46px; }
input:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid #b94700; outline-offset: 3px; }
.haro-welcome { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 32px; border-radius: 16px; background: #171717; color: #fff9f1; border-bottom: 5px solid #f47708; }
.haro-eyebrow { color: #ffd12d; letter-spacing: 2px; font-size: 13px; font-weight: 700; }
.haro-welcome h1 { font-size: clamp(25px, 3vw, 38px); font-weight: 700; }
.haro-welcome > .fa-paw { color: #ffd12d; font-size: 64px; }
.haro-shortcut { color: #171717; border: 1px solid #ecdfd2; transition: border-color .15s; }
.haro-shortcut:hover { color: #171717; border-color: #b94700; text-decoration: none; }
.haro-shortcut p { color: #675d54; font-size: 15px; }
.haro-shortcut-icon { color: #b94700; font-size: 25px; }
@media (max-width: 575px) { .haro-welcome { padding: 24px; } .haro-welcome > .fa-paw { display: none; } }