/* System Vet · estilos. Paleta: fondo cálido, tinta verde azulado, un acento coral solo para la acción principal. */
:root{
  --fondo:#F5F3EF; --sup:#FFFFFF; --sup2:#FAF8F5; --tinta:#16323A; --suave:#5B6A6F; --tenue:#8A9599; --linea:#E4E0D9; --linea2:#D3CEC5;
  --acento:#C9532E; --acento-h:#B04624; --ok:#2E7352; --ok-f:#E7F2EC; --aviso:#8A5A0B; --aviso-f:#FBF1DE; --mal:#A42A21; --mal-f:#FBE8E6;
  --r:10px; --r2:14px; --sombra:0 8px 24px -14px rgba(22,50,58,.35);
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--tinta);font:15px/1.5 Figtree,system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:inherit;text-underline-offset:3px}
a:hover{color:var(--acento-h)}
img,svg{max-width:100%;height:auto;display:block}
h1,h2,h3{margin:0;line-height:1.25;font-weight:700}
h2{font-size:17px}
p{margin:0 0 10px}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--acento);outline-offset:2px}
.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Marco */
.lado{position:fixed;inset:0 auto 0 0;width:236px;background:var(--tinta);color:#E8EEEF;display:flex;flex-direction:column;padding:18px 12px;z-index:40}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;padding:2px 8px 16px}
.marca span{font-weight:800;font-size:17px;line-height:1.15;display:flex;flex-direction:column}
.marca small{font-weight:500;font-size:12px;color:#A9BCC0}
.suc{padding:0 8px 12px}
.suc label{display:block;font-size:11.5px;color:#A9BCC0;margin-bottom:4px}
.suc select{width:100%;background:#21434C;border:1px solid #2F5761;color:#fff;border-radius:8px;padding:8px 32px 8px 10px;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fff' stroke-width='2'%3E%3Cpath d='m2 4 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.lado nav{display:flex;flex-direction:column;gap:2px;flex:1;overflow-y:auto}
.lado nav a{display:flex;align-items:center;gap:11px;padding:10px;border-radius:9px;text-decoration:none;color:#D5E0E2;font-weight:600}
.lado nav a:hover{background:#21434C;color:#fff}
.lado nav a.on{background:#F5F3EF;color:var(--tinta)}
.yo{display:flex;align-items:center;gap:10px;padding:12px 8px 0;border-top:1px solid #2A4C55;margin-top:10px}
.yo>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column;font-size:13px}
.yo b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.yo small{color:#A9BCC0}
.ini{width:34px;height:34px;border-radius:50%;background:#2F5761;display:grid;place-items:center;font-weight:700;flex:none}
.yo .ic{color:#D5E0E2}
.cuerpo{min-height:100vh;padding:0 28px 60px}
body.con-menu .cuerpo{margin-left:236px}
.cab{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:22px 0 18px}
.cab h1{font-size:24px;flex:1;min-width:200px}
.acc{display:flex;gap:8px;flex-wrap:wrap}
.menu-btn{display:none}
.abajo{display:none}
.velo{position:fixed;inset:0;background:rgba(10,25,30,.45);z-index:39}

/* Botones y controles */
.bt{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 16px;border-radius:var(--r);border:1px solid var(--linea2);background:var(--sup);color:var(--tinta);font-weight:600;text-decoration:none;cursor:pointer;white-space:nowrap}
.bt:hover{border-color:var(--tinta);color:var(--tinta)}
.bt.pri{background:var(--acento);border-color:var(--acento);color:#fff}
.bt.pri:hover{background:var(--acento-h);border-color:var(--acento-h);color:#fff}
.bt.peligro{color:var(--mal);border-color:#E3B4AF}
.bt.chico{min-height:34px;padding:5px 12px;font-size:13.5px}
.bt.ancho{width:100%}
.ic{background:none;border:0;padding:6px;border-radius:8px;cursor:pointer;color:var(--suave);display:inline-flex}
.ic:hover{background:rgba(0,0,0,.06);color:var(--tinta)}
.ic-bt{padding:8px 10px}
.enlace{background:none;border:0;padding:0;color:var(--acento-h);text-decoration:underline;cursor:pointer;font-size:inherit}
.form label,.campo{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:13.5px;min-width:0}
.lbl{font-weight:600;font-size:13.5px}
input:not([type=checkbox]):not([type=radio]),select,textarea{width:100%;min-height:42px;padding:9px 12px;border:1px solid var(--linea2);border-radius:var(--r);background:var(--sup);font-weight:400;font-size:15px}
textarea{min-height:84px;resize:vertical;line-height:1.45}
select{appearance:none;padding-right:40px;background-color:var(--sup);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%2316323A' stroke-width='2'%3E%3Cpath d='m2 4 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
input:focus,select:focus,textarea:focus{border-color:var(--tinta);outline:none;box-shadow:0 0 0 3px rgba(22,50,58,.12)}
input[readonly],textarea[readonly]{background:var(--sup2);color:var(--suave)}
.form .check{flex-direction:row;align-items:center;gap:9px;font-weight:500}
.check input{width:18px;height:18px;accent-color:var(--tinta)}
.ayuda{font-weight:400;font-size:12.5px;color:var(--suave)}
.u{display:flex;align-items:center;position:relative}
.u i{font-style:normal;color:var(--suave);font-size:13px;position:absolute;right:12px;pointer-events:none}
.u i.pre{left:12px;right:auto}
.u i.pre+input{padding-left:24px}
.rejilla-f{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}
.ancho2{grid-column:1/-1}
.bts-f{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.bts-f.pegado{position:sticky;bottom:0;background:linear-gradient(transparent,var(--fondo) 30%);padding:18px 0 10px;margin-top:4px}
.fila-f{display:flex;gap:8px;align-items:center}
.fila-f select,.fila-f input{width:auto}
fieldset{border:1px solid var(--linea);border-radius:var(--r2);padding:14px 16px;margin:0}
legend{font-weight:700;padding:0 6px}
.dueno-f .rejilla-f{margin-top:6px}

/* Bloques */
.caja-s{background:var(--sup);border:1px solid var(--linea);border-radius:var(--r2);padding:18px 20px;margin-bottom:16px}
.caja-s>h2{margin-bottom:14px}
.caja-s.destacada{border-color:var(--tinta)}
.caja-c{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.caja-c h2{flex:0 1 auto}
.cuenta{background:var(--fondo);border-radius:999px;padding:1px 9px;font-size:13px;font-weight:700;color:var(--suave)}
.caja-c .mas{margin-left:auto;font-size:13.5px;font-weight:600;color:var(--acento-h)}
.sub-t{font-size:13px;font-weight:700;color:var(--suave);margin:14px 0 6px}
.vacio-c{color:var(--suave);margin:4px 0}
.nota{color:var(--suave);font-size:13px}
.aviso{border-radius:var(--r);padding:11px 14px;margin-bottom:16px;font-weight:600;background:var(--ok-f);color:var(--ok)}
.aviso.error{background:var(--mal-f);color:var(--mal)}
.tag{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:700;background:var(--fondo);color:var(--suave);white-space:nowrap}
.tag.ok{background:var(--ok-f);color:var(--ok)} .tag.aviso{background:var(--aviso-f);color:var(--aviso)} .tag.mal{background:var(--mal-f);color:var(--mal)}
.mal-txt{color:var(--mal);font-weight:600}
.alerta-txt{color:var(--mal);font-weight:600;font-size:13px}
.alerta-caja{background:var(--mal-f);color:var(--mal);border-radius:var(--r);padding:9px 12px;font-size:14px}
.alerta-caja.suave{background:var(--aviso-f);color:var(--aviso)}
.cifra{font-size:28px;font-weight:800;margin:0 0 6px}
.cifra small{display:block;font-size:13px;font-weight:500;color:var(--suave)}
.monto{font-weight:700;white-space:nowrap}

/* Listas */
.lista-simple,.lista-citas,.lista-pac,.hist{list-style:none;margin:0;padding:0}
.lista-simple li{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--linea)}
.lista-simple li:first-child{border-top:0}
.q{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.q span{color:var(--suave);font-size:13.5px}
.q b a{text-decoration:none}
.q b a:hover{text-decoration:underline}
.lista-citas li{display:grid;grid-template-columns:62px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--linea)}
.lista-citas li:first-child{border-top:0}
.lista-citas time{font-weight:800;font-size:16px;display:flex;flex-direction:column;line-height:1.2}
.lista-citas time small{font-weight:500;font-size:12px;color:var(--tenue)}
.lista-citas li.hecha{opacity:.6}
.bts{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.bts select{min-height:34px;padding:4px 34px 4px 10px;font-size:13.5px;width:auto}
.lista-pac li a{display:flex;align-items:center;gap:13px;padding:11px 8px;margin:0 -8px;border-radius:var(--r);text-decoration:none}
.lista-pac li a:hover{background:var(--sup2);color:inherit}
.lista-pac .der{margin-left:auto;text-align:right}
.av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:17px;flex:none;background:#E6EDEE;color:var(--tinta)}
.av.perro{background:#F3E3D6;color:#8A4A22}.av.gato{background:#E3E6F3;color:#3B4A8A}.av.ave{background:#E4F1DE;color:#3F6B2B}.av.conejo{background:#F3E5EC;color:#8A3B5E}
.av.grande{width:64px;height:64px;font-size:26px}
.hist li a{display:grid;grid-template-columns:110px minmax(0,1fr) auto;gap:2px 12px;padding:11px 8px;margin:0 -8px;border-radius:var(--r);text-decoration:none;border-top:1px solid var(--linea)}
.hist li:first-child a{border-top:0}
.hist li a:hover{background:var(--sup2);color:inherit}
.hist time{color:var(--suave);font-size:13.5px;grid-row:1/3}
.hist span{color:var(--suave);font-size:13px;grid-column:2}
.hist .tag{grid-column:3;grid-row:1}
.busca-g{display:flex;gap:8px;margin-bottom:12px}
.busca-g select{width:auto}
.barra-dia{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.pestanas{display:flex;gap:4px;border-bottom:1px solid var(--linea);margin:-4px 0 12px}
.pestanas a{padding:9px 12px;text-decoration:none;font-weight:600;color:var(--suave);border-bottom:2px solid transparent;margin-bottom:-1px}
.pestanas a.on{color:var(--tinta);border-color:var(--tinta)}
.metodos{list-style:none;display:flex;gap:10px;flex-wrap:wrap;padding:0;margin:4px 0 8px}
.metodos li{border:1px solid var(--linea);border-radius:var(--r);padding:9px 14px;display:flex;flex-direction:column;min-width:130px}
.metodos span,.metodos small{color:var(--suave);font-size:12.5px}
.metodos b{font-size:17px}

/* Hoy */
.rejilla-hoy{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:0 16px;align-items:start}
.rejilla-hoy .principal{grid-row:span 3}

/* Fichas */
.ficha{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:16px;align-items:start}
.ficha-cab{display:flex;gap:14px;align-items:center;margin-bottom:12px}
.ficha-cab p{color:var(--suave);margin:2px 0 0}
.datos{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;margin:12px 0}
.datos dt{color:var(--suave);font-size:13px}
.datos dd{margin:0;font-weight:600;min-width:0;overflow-wrap:anywhere}
.editar{margin-top:12px;border-top:1px solid var(--linea);padding-top:10px}
.editar>summary,.fila-d>summary{cursor:pointer;font-weight:600;color:var(--acento-h);list-style:none}
.editar>summary::-webkit-details-marker,.fila-d>summary::-webkit-details-marker{display:none}
.editar[open]>summary{margin-bottom:12px}
.caja-s.editar{margin-top:0}
.fila-d{width:100%}
.fila-d>summary{color:inherit}
.fila-d[open]{padding-bottom:6px}
.fila-d .form{margin:12px 0}
.fallecio{margin-top:14px;align-items:flex-end;flex-wrap:wrap}
.peso-g{margin:8px 0 0}
.peso-g figcaption{font-size:12.5px;color:var(--suave)}
.peso-g svg{color:var(--tinta);height:70px;width:100%}
.volver{font-size:13px;font-weight:600;color:var(--acento-h);display:inline-block;margin-bottom:8px}
.q-grande{font-size:16px}

/* Consulta */
.consulta{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:16px;align-items:start}
.cons-lado{position:sticky;top:12px}
.signos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.soap{display:flex;flex-direction:column;gap:14px}
.rx,.cargos{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.rx-f{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr 1.2fr;gap:8px;padding-bottom:10px;border-bottom:1px dashed var(--linea)}
.rx-f .ancho,.rx-f .tag{grid-column:1/-1}
.rx-f .tag{justify-self:start}
.cg-f,.agrega-item{display:grid;grid-template-columns:minmax(0,1fr) 90px auto;gap:8px;align-items:start}
.cg-f{grid-template-columns:minmax(0,1fr) 90px}
.cant{text-align:right}

/* Buscador */
.buscador{position:relative}
.sug{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;list-style:none;margin:0;padding:6px;background:var(--sup);border:1px solid var(--linea2);border-radius:var(--r);box-shadow:var(--sombra);max-height:300px;overflow-y:auto}
.sug li{padding:8px 10px;border-radius:8px;cursor:pointer;display:flex;flex-direction:column}
.sug li small{color:var(--suave)}
.sug li[aria-selected=true],.sug li:hover{background:var(--fondo)}
.sug li.nada{cursor:default;color:var(--suave)}
.buscador.elegido input[type=search]{border-color:var(--ok);background:#FBFEFC}

/* Caja */
.venta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:16px;align-items:start}
.tabla-env{overflow-x:auto}
.tabla{width:100%;border-collapse:collapse;font-size:14px}
.tabla th{text-align:left;font-size:12px;color:var(--suave);font-weight:700;padding:8px 6px;border-bottom:1px solid var(--linea2)}
.tabla td{padding:9px 6px;border-bottom:1px solid var(--linea);vertical-align:top}
.tabla .n{text-align:right;white-space:nowrap}
.tabla tfoot td{border:0;padding:5px 6px;color:var(--suave)}
.tabla tfoot .tot td{color:var(--tinta);font-weight:800;font-size:16px}
.tabla td a{font-weight:600}
.bloque{display:block;color:var(--suave)}
.agrega-item{margin-top:14px}
.metodo-f{display:flex;flex-wrap:wrap;gap:8px;border:0;padding:0;margin:0 0 4px}
.metodo-f legend{padding:0;margin-bottom:6px}
.opc{flex-direction:row!important;font-weight:500!important}
.opc input{position:absolute;opacity:0}
.opc span{display:inline-block;padding:8px 13px;border:1px solid var(--linea2);border-radius:var(--r);cursor:pointer}
.opc input:checked+span{background:var(--tinta);border-color:var(--tinta);color:#fff}
.opc input:focus-visible+span{outline:2px solid var(--acento);outline-offset:2px}
.venta-lado .form{display:flex;flex-direction:column;gap:12px}
.copiar{display:flex;gap:8px;flex-wrap:wrap}
.copiar input{flex:1;min-width:220px}

/* Acceso */
body.sin-menu .cuerpo{padding:0 18px}
body.sin-menu .cab{display:none}
.acceso{max-width:400px;margin:9vh auto 40px;background:var(--sup);border:1px solid var(--linea);border-radius:18px;padding:32px 28px;text-align:center}
.acceso img{margin:0 auto 12px}
.acceso h2{font-size:24px}
.acceso .sub{color:var(--suave);margin:6px 0 20px}
.acceso .form{display:flex;flex-direction:column;gap:14px;text-align:left}
.acceso .nota{margin:16px 0 0}
.vacio{text-align:center;padding:60px 0}

/* Impresión */
body.impreso{background:#fff}
.hoja{max-width:760px;margin:0 auto;padding:36px 40px}
.hoja-cab{display:flex;justify-content:space-between;gap:20px;border-bottom:2px solid var(--tinta);padding-bottom:12px}
.hoja-cab div{display:flex;flex-direction:column;font-size:13px}
.hoja-cab .der{text-align:right}
.hoja-cl{font-size:20px}
.hoja-fecha{text-align:right;margin:10px 0}
.hoja-pac{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:14px}
.hoja-pac dt{color:var(--suave)} .hoja-pac dd{margin:0}
.hoja-t{font-size:30px;margin:20px 0 8px;font-style:italic}
.hoja-rx{padding-left:20px} .hoja-rx li{margin-bottom:12px} .hoja-rx span{display:block;font-size:14px}
.hoja-st{font-size:14px;margin-top:16px}
.hoja-firma{margin:70px 0 20px auto;width:260px;text-align:center;font-size:13px}
.hoja-firma span{display:block;border-top:1px solid var(--tinta);margin-bottom:4px}
.ticket{max-width:320px;margin:0 auto;padding:20px;font-size:13px;display:flex;flex-direction:column;align-items:center;text-align:center}
.ticket table{width:100%;text-align:left;margin:8px 0}
.ticket td{padding:3px 0} .ticket .n{text-align:right}
.ticket .sep td{border-top:1px dashed #999;padding-top:6px}
.ticket .tot td{font-weight:800}
@media print{.no-imp{display:none!important}.hoja,.ticket{padding:0}}

/* Pantallas medianas y celular */
@media (max-width:1100px){.rejilla-hoy{grid-template-columns:1fr}.rejilla-hoy .principal{grid-row:auto}.signos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:980px){.ficha,.consulta,.venta{grid-template-columns:1fr}.cons-lado{position:static}}
@media (max-width:900px){
  body.con-menu .cuerpo{margin-left:0;padding:0 16px calc(90px + env(safe-area-inset-bottom,0px))}
  .lado{transform:translateX(-100%);transition:transform .22s;width:270px}
  .lado.abierto{transform:none}
  .menu-btn{display:inline-flex;margin-left:-6px}
  .cab{padding:14px 0 12px;gap:8px}
  .cab h1{font-size:20px;min-width:0}
  .acc{width:100%}
  .acc .bt{flex:1}
  .abajo{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:35;background:var(--sup);border-top:1px solid var(--linea);padding-bottom:env(safe-area-inset-bottom,0px)}
  .abajo a,.abajo button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px 7px;font-size:11px;font-weight:600;text-decoration:none;color:var(--suave);background:none;border:0;cursor:pointer}
  .abajo a.on{color:var(--tinta)}
  .bts-f.pegado{bottom:calc(64px + env(safe-area-inset-bottom,0px))}
}
@media (max-width:640px){
  .rejilla-f{grid-template-columns:1fr}
  .caja-s{padding:16px 14px}
  .lista-citas li{grid-template-columns:52px minmax(0,1fr);row-gap:8px}
  .lista-citas li>.tag{grid-column:2;justify-self:start}
  .lista-citas .bts{grid-column:1/-1;justify-content:flex-start}
  .lista-simple li{flex-wrap:wrap}
  .lista-pac .der{display:none}
  .rx-f{grid-template-columns:1fr 1fr}
  .rx-f>.buscador{grid-column:1/-1}
  .hist li a{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
  .hist .tag{margin-top:4px}
  .busca-g{flex-wrap:wrap}.busca-g input{flex:1 1 100%}
  .barra-dia .nota{width:100%}
  .metodos li{flex:1}
}
@media (prefers-reduced-motion:reduce){.lado{transition:none}}