:root{--pet-primary:#ff7e5f;--pet-primary-hover:#f36846;--pet-bg-gradient:linear-gradient(135deg, #ff7e5f, #feb47b);--pet-text-main:#1e293b;--pet-text-sub:#64748b;--pet-border-color:#e2e8f0}.pet-passport-container{max-width:920px;margin:20px auto;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--pet-text-main);padding:0 8px;box-sizing:border-box}.pet-passport-header{background:var(--pet-bg-gradient);color:#fff;padding:22px 24px;border-radius:16px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}.header-title-box h2{color:#fff!important;margin:0 0 6px 0;font-size:1.5rem;font-weight:700}.header-title-box p{margin:0;font-size:.88rem;opacity:.95}.header-right-box{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.btn-add-pet{background:#fff;color:var(--pet-primary);border:none;padding:10px 20px;border-radius:30px;font-weight:700;font-size:.9rem;cursor:pointer}.pet-coin-badge{background:rgb(255 255 255 / .25);padding:8px 16px;border-radius:30px;color:#fff;font-size:.88rem}.pet-filter-bar{margin-top:18px;background:#fff;padding:14px 18px;border-radius:14px;border:1px solid var(--pet-border-color)}.filter-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.input-search{flex:1;min-width:200px;padding:10px 14px;border:1px solid #cbd5e0;border-radius:10px;font-size:.9rem}.select-sort{padding:10px 14px;border:1px solid #cbd5e0;border-radius:10px;font-size:.9rem;background:#fff}.btn-filter{background:var(--pet-primary);color:#fff;border:none;padding:10px 20px;border-radius:10px;font-weight:700;cursor:pointer}.pet-cards-wrapper{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px;margin-top:20px}.pet-passport-card{background:#fff;border:1px solid var(--pet-border-color);border-radius:16px;padding:20px;display:flex;flex-direction:column;justify-content:space-between}.passport-card-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed #cbd5e0;padding-bottom:10px;margin-bottom:14px}.badge-passport{background:#ffedd5;color:#c2410c;padding:4px 10px;border-radius:12px;font-size:.72rem;font-weight:800}.passport-no{font-size:.85rem;font-weight:700;color:var(--pet-text-sub)}.passport-body{display:flex;gap:16px;align-items:center}.pet-card-avatar-img{width:82px;height:82px;border-radius:50%;object-fit:cover;border:3px solid #ffe4e6}.btn-show-qr{font-size:.72rem;padding:5px 10px;border-radius:8px;border:1px solid #cbd5e0;background:#f8fafc;margin-top:8px;width:100%;cursor:pointer}.pet-name{margin:0 0 6px 0;font-size:1.25rem;font-weight:800}.pet-meta{margin:0 0 3px 0;font-size:.82rem;color:var(--pet-text-sub)}.pet-status-pill{display:inline-block;background:#f0fdf4;color:#166534;border:1px solid #bbf7d0;padding:2px 10px;border-radius:12px;font-size:.75rem;font-weight:700;margin-top:6px}.passport-highlights{display:flex;justify-content:space-between;background:#f8fafc;padding:12px 14px;border-radius:12px;margin-top:16px;font-size:.8rem;border:1px solid #f1f5f9}.passport-footer{margin-top:16px;padding-top:12px;border-top:1px solid #f1f5f9}.card-actions{display:flex;gap:6px;flex-wrap:wrap}.btn-action-sm{flex:1;min-width:50px;background:#fff;border:1px solid #cbd5e0;padding:7px 6px;border-radius:8px;font-size:.78rem;cursor:pointer;font-weight:700;text-align:center}.btn-action-sm.btn-view{border-color:#10b981;color:#047857;background:#ecfdf5}.btn-action-sm.btn-edit{border-color:#3b82f6;color:#1d4ed8;background:#eff6ff}.btn-action-sm.btn-delete{border-color:#f87171;color:#dc2626;background:#fef2f2}.pet-pagination{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:28px;flex-wrap:wrap}.page-num{padding:8px 16px;border:1px solid #cbd5e0;border-radius:10px;color:var(--pet-text-main);text-decoration:none;font-size:.9rem;font-weight:600;background:#fff}.page-num.active{background:var(--pet-primary)!important;color:#ffffff!important;border-color:var(--pet-primary)!important;font-weight:800;box-shadow:0 4px 12px rgb(255 126 95 / .3)}.pet-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgb(15 23 42 / .65);display:none;justify-content:center;align-items:flex-start;padding:30px 14px;overflow-y:auto;z-index:999999;box-sizing:border-box}.pet-modal-content{background:#fff;padding:26px 28px;border-radius:20px;width:100%;max-width:480px;max-height:88vh;overflow-y:auto;position:relative;box-sizing:border-box}.pet-modal-close{position:absolute;right:20px;top:18px;font-size:26px;cursor:pointer;color:#94a3b8}.avatar-upload-container{display:flex;flex-direction:column;align-items:center;margin-bottom:20px;padding:16px;background:#f8fafc;border-radius:14px;border:1px dashed #cbd5e0}.avatar-preview-wrapper img{width:90px;height:90px;border-radius:50%;object-fit:cover;border:3px solid var(--pet-primary)}.avatar-upload-controls{margin-top:12px;display:flex;gap:10px;align-items:center}.btn-upload-label{background:#fff;border:1px solid #cbd5e0;padding:6px 14px;border-radius:20px;font-size:.8rem;font-weight:700;cursor:pointer}.btn-remove-avatar-sm{background:#fef2f2;border:1px solid #fecaca;color:#dc2626;padding:6px 12px;border-radius:20px;font-size:.78rem;font-weight:700;cursor:pointer}.form-group{margin-bottom:14px}.form-group label{display:block;font-size:.82rem;font-weight:700;margin-bottom:6px}.form-group input,.form-group select{width:100%;padding:10px 14px;border:1px solid #cbd5e0;border-radius:10px;box-sizing:border-box;font-size:.9rem}.form-row{display:flex;gap:12px}.col-6{flex:1}.btn-submit-pet{width:100%;background:var(--pet-primary);color:#fff;border:none;padding:13px;border-radius:12px;font-weight:800;cursor:pointer;margin-top:10px}.view-detail-header{display:flex;gap:16px;align-items:center;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid #f1f5f9}.view-detail-header img{width:76px;height:76px;border-radius:50%;object-fit:cover;border:3px solid var(--pet-primary)}.view-info-table{width:100%;border-collapse:collapse;font-size:.88rem}.view-info-table td{padding:8px 6px;border-bottom:1px solid #f8fafc}.view-info-table td.lbl{color:var(--pet-text-sub);width:35%;font-weight:700}@media (max-width:600px){.pet-passport-header{flex-direction:column;align-items:flex-start;padding:18px 16px}.header-right-box{width:100%;justify-content:space-between}.pet-cards-wrapper{grid-template-columns:1fr}.filter-form{flex-direction:column;align-items:stretch}.input-search,.select-sort,.btn-filter{width:100%}.form-row{flex-direction:column;gap:0}.card-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.btn-action-sm{min-width:unset;padding:8px 4px;font-size:.75rem}.pet-modal-content{padding:20px 18px}}