#vista-odontologia [hidden] { display:none!important; }
.odonto-portada { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:24px; background:var(--ox-surface); border:1px solid var(--ox-border); border-radius:16px; margin-bottom:20px; }
.odonto-portada h2 { font-size:26px; letter-spacing:-.6px; margin:4px 0 8px; }
.odonto-eyebrow { color:#14776d; font-size:11px; font-weight:700; letter-spacing:1.6px; }
.odonto-portada p,.odonto-cabecera p,#vista-odontologia section>p { color:var(--ox-text-2); font-size:13px; line-height:1.6; }
.odonto-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:12px 0; }
.odonto-layout { display:grid; grid-template-columns:280px minmax(0,1fr); gap:22px; align-items:start; }
.odonto-layout>* { min-width:0; }
#vista-odontologia .ox-card { min-width:0; }
.odonto-toolbar>label { min-width:0; max-width:100%; }
.odonto-registro p,#vista-odontologia section>p { overflow-wrap:anywhere; }
.odonto-lateral,.odonto-vacio { padding:18px; border:1px solid var(--ox-border); border-radius:14px; background:var(--ox-surface); }
.odonto-lateral h3 { font-size:16px; margin-bottom:14px; }
.odonto-lateral label,.odonto-form label { display:flex; flex-direction:column; gap:6px; margin:10px 0; font-size:13px; }
#vista-odontologia input,#vista-odontologia select,.odonto-form input,.odonto-form textarea,.odonto-form select { width:100%; min-width:0; padding:10px; border:1px solid var(--ox-border); border-radius:8px; font:inherit; color:var(--ox-text); background:var(--ox-bg); }
.odonto-form { font-size:14px; line-height:1.6; }
.odonto-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.odonto-form .odonto-check { flex-direction:row; align-items:center; }
.odonto-check input { width:auto; }
.odonto-turno { border-top:1px solid var(--ox-border); padding:16px 0; font-size:13px; }
.odonto-turno strong { color:#14776d; }
.odonto-turno p { margin:6px 0; overflow-wrap:anywhere; }
.odonto-cabecera { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; margin:18px 0; }
#odonto-paciente .ox-card { padding:20px; margin:16px 0; }
#odonto-dientes { overflow-x:auto; padding:12px 0; }
.odonto-arco { display:flex; justify-content:center; gap:3px; min-width:650px; margin:10px 0; }
.odonto-pieza { flex:1; min-width:37px; max-width:55px; }
.odonto-pieza .odonto-diente { width:100%; }
.odonto-superficies { display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(3,14px); gap:1px; width:100%; max-width:55px; margin:5px auto; }
.odonto-superficie { border:1px solid #8da59d; background:var(--diente-color,#fff); color:#172b26; font:8px Arial; padding:0; cursor:pointer; min-width:0; }
.odonto-superficie:disabled { opacity:1; cursor:default; }
.odonto-superficie:focus-visible { outline:2px solid #0f766e; }
.odonto-superficie-0 { grid-column:2; grid-row:1; }.odonto-superficie-1 { grid-column:1; grid-row:2; }.odonto-superficie-2 { grid-column:2; grid-row:2; }.odonto-superficie-3 { grid-column:3; grid-row:2; }.odonto-superficie-4 { grid-column:2; grid-row:3; }
.odonto-perio-pieza { padding:8px 0; border-bottom:1px solid #d5dfda; }
.odonto-perio-pieza summary { cursor:pointer; padding:10px; font-weight:600; }
.odonto-perio-pieza fieldset { min-width:0; border:1px solid #d5dfda; padding:8px; }
.odonto-perio-pieza fieldset:disabled { opacity:.55; }
.odonto-perio-scroll { overflow-x:auto; max-width:100%; }
.odonto-perio-tabla { border-collapse:collapse; width:100%; font-size:12px; margin:12px 0; }
.odonto-perio-tabla th,.odonto-perio-tabla td { padding:8px; border:1px solid #d5dfda; text-align:left; }
.odonto-perio-tabla th { background:#f2f7f4; }
.odonto-perio-tabla input { min-width:65px; box-sizing:border-box; }
.odonto-perio-tabla select { min-width:100px; }
.odonto-eval-piezas { display:grid; grid-template-columns:repeat(auto-fit,minmax(60px,1fr)); gap:8px; }
.odonto-eval-piezas>div { text-align:center; padding:8px 2px; border:1px solid #d5dfda; border-radius:8px; }
.odonto-eval-piezas small { display:block; font-size:10px; }
.odonto-perio-graficos { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr)); gap:16px; }
.odonto-perio-grafico { display:block; width:100%; max-width:350px; background:#f8faf9; border:1px solid #d5dfda; border-radius:8px; }
.odonto-perio-grafico text { font:10px Arial; }
#odonto-eval-detalle { overflow-wrap:anywhere; }
.orto-caso { padding:18px 0; border-top:1px solid #d5dfda; margin-top:14px; overflow-wrap:anywhere; }
.orto-caso h3,.orto-caso h4 { margin:12px 0 8px; }
.orto-caso p { margin:8px 0; line-height:1.6; }
.orto-caso summary { cursor:pointer; padding:12px 0; font-weight:600; }
.orto-progresos { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr)); gap:16px; margin:16px 0; }
.orto-progresos>div { border:1px solid #d5dfda; border-radius:10px; padding:14px; background:#f3f8f5; }
.orto-progresos progress { width:100%; display:block; margin-top:10px; height:12px; accent-color:#14776d; }
.orto-ultimo { padding:14px; background:#f5f8f6; border-radius:10px; }
.orto-control { border-top:1px solid #d5dfda; padding:12px 0; }
.orto-pendiente { padding:12px; background:#fff6e5; color:#795200; border-radius:8px; }
.orto-higiene svg { display:block; width:100%; max-width:500px; font:10px Arial; }
#odonto-orto-reporte .ox-card { padding:20px; }
.odonto-diente { flex:1; max-width:55px; min-width:37px; padding:5px 1px; border:1px solid transparent; border-radius:8px; background:var(--ox-bg); color:var(--ox-text); cursor:pointer; }
.odonto-diente:hover,.odonto-diente:focus-visible { border-color:#14776d; outline:2px solid #a0d6cc; }
.odonto-diente span { display:block; font-size:12px; font-weight:600; }
.odonto-diente svg { width:32px; height:42px; margin:5px 0; }
.odonto-diente svg path { fill:var(--diente-color,#eff0ef); stroke:#7c8d89; stroke-width:1.3; }
.odonto-diente svg .odonto-surco { fill:none; }
.odonto-diente small { display:block; font-size:8px; white-space:nowrap; }
[data-condicion=sano] { --diente-color:#b4e5cb; } [data-condicion=caries] { --diente-color:#f4a6a6; }
[data-condicion=restaurado] { --diente-color:#a5c9f5; } [data-condicion=ausente] { --diente-color:#767e87; }
[data-condicion=corona] { --diente-color:#f0d38b; } [data-condicion=implante] { --diente-color:#c6aff0; }
[data-condicion=endodoncia] { --diente-color:#f6bd8d; }
.odonto-leyenda { display:flex; flex-wrap:wrap; gap:8px; font-size:11px; }
.odonto-leyenda span { padding:4px 7px; border-radius:6px; background:var(--diente-color,#eff0ef); color:#243830; }
.odonto-tratamientos article { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; border-top:1px solid var(--ox-border); padding:15px 0; font-size:13px; }
.odonto-registro { border-top:1px solid var(--ox-border); padding:14px 0; font-size:13px; }
.odonto-texto { white-space:pre-wrap; overflow-wrap:anywhere; margin:8px 0; }
.odonto-kanban { display:grid; grid-template-columns:repeat(5,minmax(220px,1fr)); gap:14px; overflow-x:auto; padding-bottom:16px; }
.odonto-kanban>section { --etapa:#6d28d9; --etapa-suave:#f5f0ff; --etapa-borde:#ddd0fa; min-width:0; background:var(--etapa-suave); border:1px solid var(--etapa-borde); border-top:4px solid var(--etapa); border-radius:12px; padding:12px; }
.odonto-kanban>[data-odonto-etapa=aceptado] { --etapa:#1d4ed8; --etapa-suave:#eff6ff; --etapa-borde:#bfdbfe; }
.odonto-kanban>[data-odonto-etapa=en_curso] { --etapa:#a85208; --etapa-suave:#fff7e6; --etapa-borde:#f4d59a; }
.odonto-kanban>[data-odonto-etapa=completado] { --etapa:#047857; --etapa-suave:#ecfdf5; --etapa-borde:#a7e4cd; }
.odonto-kanban>[data-odonto-etapa=cancelado] { --etapa:#be123c; --etapa-suave:#fff1f2; --etapa-borde:#fecdd3; }
.odonto-kanban h3 { font-size:14px; display:flex; justify-content:space-between; align-items:center; gap:8px; color:var(--etapa); }
.odonto-kanban h3 .ox-badge { background:var(--etapa); color:white; border:0; border-radius:999px; padding:3px 8px; }
.odonto-kanban article { padding:14px; margin:12px 0; overflow-wrap:anywhere; font-size:13px; background:linear-gradient(120deg,#fff 65%,var(--etapa-suave)); border:1px solid var(--etapa-borde); border-left:4px solid var(--etapa); box-shadow:0 3px 9px #17203308; }
.odonto-kanban article strong { color:var(--etapa); }
.odonto-kanban article button { margin-top:6px; }
.odonto-avance { display:block; width:100%; height:8px; accent-color:var(--etapa,#14776d); margin:8px 0 12px; }
.odonto-avance-texto { font-size:12px; font-weight:600; }
.odonto-historia-filtros { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr)); gap:12px; margin:16px 0; }
.odonto-historia-filtros label { display:flex; flex-direction:column; gap:6px; font-size:12px; min-width:0; }
.odonto-historia-filtros input,.odonto-historia-filtros select { width:100%; min-width:0; box-sizing:border-box; }
.odonto-antecedentes { border-left:4px solid #14776d; }
.odonto-antecedentes summary,.odonto-ficha-citas summary { cursor:pointer; padding:10px 0; font-weight:600; }
.odonto-ficha-citas article { padding:10px 0; border-bottom:1px solid var(--ox-border); }
.odonto-antecedentes,.odonto-ficha-citas,#odonto-historia-registros { overflow-wrap:anywhere; }
.odonto-sesiones { margin:12px 0; font-size:12px; }
.odonto-sesiones summary { cursor:pointer; color:#14776d; }
.odonto-sesiones>div { padding:10px 0; border-bottom:1px solid var(--ox-border); }
.odonto-retorno-ficha { position:sticky; top:0; z-index:2; background:var(--ox-bg,#f7f7f5); padding:10px 0; }
.odonto-cal-controles { display:flex; gap:10px; flex-wrap:wrap; align-items:end; margin:16px 0; }
.odonto-cal-controles label { display:flex; flex-direction:column; gap:5px; font-size:12px; min-width:120px; }
.odonto-cal-scroll { overflow-x:auto; max-width:100%; border:1px solid var(--ox-border); border-radius:12px; background:white; }
.odonto-cal-grid { display:grid; grid-template-columns:repeat(7,minmax(145px,1fr)); }
.odonto-cal-grid.vista-dia { grid-template-columns:minmax(0,1fr); }
.odonto-cal-dow { padding:12px; background:#f3f5f4; text-align:center; font-size:12px; font-weight:600; }
.odonto-cal-dia { min-height:130px; padding:8px; border-top:1px solid #e5e7eb; border-right:1px solid #e5e7eb; min-width:0; }
.odonto-cal-dia.es-hoy { background:#eff9f6; box-shadow:inset 0 3px #14776d; }
.odonto-cal-dia.otro-mes { background:#f8f8f8; }
.odonto-cal-dia-cabecera { display:flex; justify-content:space-between; gap:4px; margin-bottom:8px; }
.odonto-cal-dia-cabecera button { border:0; background:transparent; cursor:pointer; padding:5px 8px; border-radius:6px; color:#205d51; font-weight:600; }
.odonto-cal-dia-cabecera button:hover { background:#d4eee5; }
.odonto-cal-turno { display:block; text-align:left; width:100%; margin:5px 0; padding:8px; border:1px solid #bfdbfe; border-left:3px solid #2563eb; border-radius:7px; background:#eff6ff; color:#1e3a8a; cursor:pointer; font:inherit; font-size:11px; overflow-wrap:anywhere; }
.odonto-cal-turno span { display:block; margin-top:3px; }
.odonto-cal-turno[data-estado=confirmada] { background:#f5f0ff; border-color:#d8c7f5; color:#5b21b6; }
.odonto-cal-turno[data-estado=atendida] { background:#ecfdf5; border-color:#a7e4cd; color:#065f46; }
.odonto-cal-turno[data-estado=cancelada],.odonto-cal-turno[data-estado=ausente] { background:#fff1f2; border-color:#fecdd3; color:#9f1239; }
.odonto-cal-paciente { border-bottom:1px solid var(--ox-border); padding-bottom:12px; }
.odonto-consultorio-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr)); gap:16px; }
#odonto-consultorio .ox-card { margin:16px 0; padding:20px; min-width:0; }
#odonto-consultorio article { padding:14px 0; border-bottom:1px solid var(--ox-border); overflow-wrap:anywhere; }
#odonto-consultorio p { line-height:1.6; }
#odonto-consultorio summary { cursor:pointer; padding:8px 0; }
.odonto-cal-bloque { font-size:11px; background:#f1f5f2; border-left:3px solid #577867; padding:7px; margin:5px 0; overflow-wrap:anywhere; }
@media(max-width:1050px) { .odonto-layout { grid-template-columns:minmax(0,1fr); } #odonto-agenda { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr)); gap:12px; } }
@media(max-width:600px) { .odonto-portada { padding:18px; align-items:start; flex-direction:column; } .odonto-grid { grid-template-columns:1fr; } #odonto-paciente .ox-card { padding:12px; } }
/* Simulador: foto y pincel con la misma escala, usable con mouse y touch. */
.odonto-sonrisa{max-width:760px;margin:auto}
.odonto-sonrisa label{display:flex;flex-direction:column;gap:6px;margin:12px 0}
.odonto-sonrisa input,.odonto-sonrisa select,.odonto-sonrisa textarea{max-width:100%;box-sizing:border-box}
.odonto-sonrisa input[type=range]{width:100%}
.odonto-sonrisa input[type=checkbox]{width:auto}
.odonto-sonrisa label.sonrisa-opcion{flex-direction:row;align-items:flex-start;gap:8px}
.sonrisa-opcion input{flex:0 0 auto;margin-top:3px}
.odonto-sonrisa [hidden]{display:none!important}
#sonrisa-lienzo{display:block;width:100%;height:auto;max-width:650px;touch-action:none;border:1px solid #cbd5e1;border-radius:10px;cursor:crosshair}
.sonrisa-comparador{position:relative;width:100%;aspect-ratio:1;overflow:hidden;border-radius:10px;background:#fff}
.sonrisa-comparador img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
#sonrisa-despues{clip-path:inset(0 0 0 50%)}
.sonrisa-comparador span{position:absolute;bottom:8px;left:8px;right:8px;background:#0f172add;color:white;text-align:center;padding:6px;font-size:12px;border-radius:5px}
#sonrisa-estado,#sonrisa-disponibilidad{padding:10px;background:#eff6ff;border-radius:8px;color:#1e3a5f}
