*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:#f4f7fb;color:#172033;font-size:14px}button,input,select,textarea{font:inherit}button,.soft,.primary{border:0;border-radius:9px;padding:10px 14px;cursor:pointer;font-weight:700;text-decoration:none;display:inline-block}.primary{background:#2563eb;color:#fff}.soft{background:#eef2f7;color:#334155;border:1px solid #dbe2ea}.link{background:none;color:#2563eb;padding:4px}aside{position:fixed;inset:0 auto 0 0;width:235px;background:#0e1b36;color:#dbe6ff;display:flex;flex-direction:column;z-index:5}.brand{height:78px;display:flex;align-items:center;gap:12px;padding:0 22px;border-bottom:1px solid #22304b}.brand>span{font-size:31px}.brand b{font-size:20px;color:#fff}.brand small,.user small{display:block;color:#93a4c7;margin-top:2px}nav{padding:15px 10px;overflow:auto;flex:1}nav button{width:100%;text-align:left;color:#aebddd;background:transparent;margin:2px 0;padding:11px 13px}nav button.active,nav button:hover{background:#1e3a70;color:#fff}.user{display:flex;gap:10px;align-items:center;padding:16px;border-top:1px solid #22304b}.user>span{background:#2563eb;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;font-weight:800}main{margin-left:235px;min-height:100vh}header{height:70px;background:#fff;border-bottom:1px solid #e6ebf2;display:flex;align-items:center;padding:0 25px;position:sticky;top:0;z-index:4}header>div:first-of-type{display:flex;flex-direction:column}header small{color:#718096;margin-top:3px}.head-actions{margin-left:auto;display:flex;gap:8px}#menu{display:none;background:none;font-size:22px}.view{display:none;padding:25px}.view.active{display:block}.welcome{background:linear-gradient(110deg,#183b77,#2563eb);color:#fff;border-radius:18px;padding:28px 32px;display:flex;justify-content:space-between;align-items:center}.welcome h1{font-size:28px;margin:7px 0}.welcome p{margin:0;color:#dbeafe}.welcome .primary{background:#fff;color:#1d4ed8}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:18px 0}.stats article,.card{background:#fff;border:1px solid #e2e8f0;border-radius:14px;box-shadow:0 2px 8px #1720330a}.stats article{padding:18px;display:flex;gap:13px;align-items:center}.stats i{width:43px;height:43px;display:grid;place-items:center;border-radius:12px;font-style:normal;font-size:20px}.blue{background:#dbeafe}.green{background:#dcfce7}.amber{background:#fef3c7}.violet{background:#ede9fe}.stats small{color:#718096}.stats strong{display:block;font-size:22px;margin-top:4px}.mini{grid-template-columns:repeat(4,1fr)}.dash-grid{display:grid;grid-template-columns:2fr 1fr;gap:18px}.card{padding:19px}.card h2{font-size:16px;margin:0 0 15px}.card-title,.page-title{display:flex;justify-content:space-between;align-items:center}.page-title{margin-bottom:18px}.page-title h1{margin:0;font-size:25px}.page-title p{margin:5px 0 0;color:#718096}.table{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;background:#f8fafc;color:#64748b;font-size:12px;text-transform:uppercase}th,td{padding:11px;border-bottom:1px solid #edf0f5}td small{color:#718096}.badge{padding:4px 9px;border-radius:20px;font-size:12px;font-weight:700;background:#dbeafe;color:#1d4ed8}.badge.green{background:#dcfce7;color:#15803d}.badge.red{background:#fee2e2;color:#b91c1c}.badge.amber{background:#fef3c7;color:#a16207}.alerts{display:grid;gap:10px}.alert{padding:12px;background:#f8fafc;border-radius:10px;display:flex;gap:10px}.alert span{font-size:20px}.alert b,.alert small{display:block}.alert small{color:#718096;margin-top:3px}.filters{display:flex;gap:9px;margin-bottom:15px}.filters input{flex:1}.filters input,.filters select,input,select,textarea{border:1px solid #cfd8e5;border-radius:8px;padding:9px;background:#fff;min-width:0}.pet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.pet-card{background:#fff;border:1px solid #e2e8f0;border-radius:14px;padding:18px}.pet-head{display:flex;gap:12px}.pet-icon{width:48px;height:48px;border-radius:50%;background:#dbeafe;display:grid;place-items:center;font-size:24px}.pet-card h3{margin:3px 0}.pet-card p{color:#64748b;line-height:1.6}.pet-card .actions{display:flex;gap:7px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-grid label,label{display:flex;flex-direction:column;gap:6px;font-weight:600}.span2{grid-column:1/-1}.form-card{max-width:850px}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:17px}dialog{border:0;border-radius:15px;width:min(720px,94vw);padding:0;box-shadow:0 20px 60px #0004}dialog::backdrop{background:#0f172a99}dialog form{padding:22px}dialog h2{margin-top:0}.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.bar{margin:12px 0}.bar>div{height:8px;background:#e2e8f0;border-radius:6px;overflow:hidden;margin-top:6px}.bar i{display:block;height:100%;background:#2563eb}.danger{color:#dc2626}.low{background:#fff7ed!important}#toast{position:fixed;right:20px;bottom:20px;background:#172033;color:#fff;padding:12px 18px;border-radius:9px;z-index:20;opacity:0;transform:translateY(20px);transition:.2s;pointer-events:none}#toast.show{opacity:1;transform:none}#printArea{display:none}@media print{body>*{display:none!important}#printArea{display:block!important;color:#000;padding:15px;font-size:12px}#printArea h1{text-align:center}#printArea table{white-space:normal}#printArea .ticket{width:72mm;margin:auto;text-align:center}#printArea .ticket .line{display:flex;justify-content:space-between;text-align:left;border-bottom:1px dashed #777;padding:5px 0}}@media(max-width:950px){aside{transform:translateX(-100%);transition:.2s}body.menu-open aside{transform:none}main{margin-left:0}#menu{display:block}.stats{grid-template-columns:1fr 1fr}.dash-grid,.report-grid{grid-template-columns:1fr}.pet-grid{grid-template-columns:1fr 1fr}}@media(max-width:600px){.view{padding:15px}header{padding:0 12px}.head-actions .soft{display:none}.stats,.mini,.pet-grid,.form-grid{grid-template-columns:1fr}.welcome{padding:20px}.welcome button{display:none}.page-title{align-items:flex-start;gap:12px}.page-title>div:last-child{display:flex;flex-direction:column}.filters{flex-direction:column}}

/* Ticket 80 mm profesional + navegación estable */
@media print{
 #printArea .ticket-pro{width:72mm;margin:0 auto;font-family:Arial,Helvetica,sans-serif;font-size:11px;line-height:1.35;color:#000;text-align:left}
 #printArea .ticket-pro h1{font-size:16px;line-height:1.2;margin:2px 0 4px;text-align:center;text-transform:uppercase}
 #printArea .ticket-brand{text-align:center;font-size:24px;margin-bottom:2px}
 #printArea .ticket-center{text-align:center}.ticket-muted{font-size:10px}.ticket-title{font-size:13px;margin:5px 0;text-align:center}
 #printArea .ticket-sep{border-top:1px dashed #333;margin:7px 0}
 #printArea .ticket-meta>div{display:flex;justify-content:space-between;gap:8px;margin:2px 0}.ticket-meta>div span{text-align:right;max-width:60%}
 #printArea .ticket-meta.compact{margin-top:7px}.ticket-headrow,.ticket-item{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.ticket-headrow{font-size:10px;text-transform:uppercase}.ticket-item{padding:5px 0}.ticket-item span{max-width:70%;white-space:normal}
 #printArea .ticket-total{display:flex;justify-content:space-between;align-items:baseline;margin:8px 0}.ticket-total span{font-weight:700}.ticket-total strong{font-size:20px}
 #printArea .ticket-note{border:1px solid #222;padding:6px;margin:9px 0;font-size:9px}.ticket-footer{font-size:9px;margin-top:7px}
}

/* Impresión térmica uniforme para todos los módulos y salida PDF de 80 mm. */
@media print{
 @page{size:80mm auto;margin:0}
 html,body{width:80mm!important;min-width:80mm!important;margin:0!important;padding:0!important;background:#fff!important}
 #printArea{display:block!important;width:80mm!important;margin:0!important;padding:2mm 3mm!important;font-family:Arial,Helvetica,sans-serif!important;font-size:10.8px!important;line-height:1.3!important;color:#000!important}
 #printArea .print-80mm,#printArea .ticket,#printArea .ticket-pro{width:74mm!important;max-width:74mm!important;margin:0 auto!important;text-align:left!important;font-size:10.8px!important;line-height:1.3!important;overflow-wrap:anywhere}
 #printArea h1{font-size:15.5px!important;line-height:1.15!important;margin:1px 0 3px!important;text-align:center!important}
 #printArea h2,#printArea .ticket-title{font-size:14px!important;line-height:1.16!important;margin:5px 0!important;text-align:center!important}
 #printArea h3{font-size:12.5px!important;margin:5px 0 3px!important}
 #printArea p{font-size:10.4px!important;line-height:1.3!important;margin:3px 0!important;white-space:normal}
 #printArea .ticket-muted,#printArea .ticket-footer,#printArea .ticket-note{font-size:9.5px!important;line-height:1.28!important}
 #printArea .ticket-brand{font-size:22px!important}.ticket-brand .ticket-logo{display:block!important;width:20mm!important;height:auto!important;max-height:16mm!important;object-fit:contain!important;margin:0 auto 1mm!important;filter:grayscale(1) contrast(1.6)!important}
 #printArea .ticket-meta>div,#printArea .ticket-item{font-size:10.5px!important;gap:5px!important;padding:3px 0!important}
 #printArea .ticket-headrow{font-size:9.5px!important}
 #printArea .ticket-total strong{font-size:21px!important}
 #printArea .ticket-sep{border-top:1.5px dashed #111!important;margin:5px 0!important}
 #printArea table{width:100%!important;white-space:normal!important;table-layout:fixed!important;font-size:10.2px!important;border-collapse:collapse!important}
 #printArea th,#printArea td{padding:5px 2px!important;word-break:break-word!important;border-bottom:1px dashed #777!important;vertical-align:top!important}
 #printArea tr,#printArea p,#printArea .ticket-item,#printArea .ticket-meta{break-inside:avoid}
}
@media(max-width:600px){.head-actions .home-return{display:inline-flex!important}.head-actions{gap:6px}.head-actions .home-return{font-size:0}.head-actions .home-return::first-letter{font-size:16px}}

@media print{
 @page a4doc{size:A4 portrait;margin:14mm}
 html:has(#printArea .print-a4),body:has(#printArea .print-a4){width:auto!important;min-width:0!important}
 body:has(#printArea .print-a4) #printArea{width:auto!important;padding:0!important}
 #printArea .print-a4{page:a4doc;width:100%!important;max-width:none!important;margin:0!important;text-align:left!important;font-size:12px!important;line-height:1.45!important}
}
