/* Centro de ayuda · Caja y reportes: piezas propias de esta sección (la tasa del día, la caja y su cierre por medio de
   pago, las cajas abiertas y anteriores, los reportes, la ventana de imprimir del navegador y «Guardar como»).
   Siempre dentro de .ay-escena; los colores salen de las variables del kit k- (ayuda.css). */

/* ---------- comunes ---------- */
.ay-escena .cr-pant { gap: 10px; }
.ay-escena .cr-fases > :not(.on) { display: none; }
.ay-escena .cr-sec { display: grid; gap: 7px; align-content: start; min-width: 0; }
.ay-escena .cr-sec-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.ay-escena .cr-pila { display: grid; gap: 3px; min-width: 0; }
.ay-escena .cr-linea { display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px 10px; }
.ay-escena .cr-chico { font-size: 10px; line-height: 1.4; color: var(--k-texto2, #55555F); }
.ay-escena .cr-acc { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.ay-escena .cr-quien { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 10.5px; }
.ay-escena .cr-nota { font-size: 10.5px; }
.ay-escena .cr-tinta { color: var(--k-texto, #1D1D24); font-weight: 600; }
.ay-escena .cr-enlace { color: var(--k-enlace, #3A3C8C); font-weight: 600; text-decoration: underline; }
.ay-escena .k-pestanas .k-etq { margin-left: 5px; min-height: 15px; padding: 0 5px; }

/* ---------- la tasa del día (Caja.vue) ---------- */
.ay-escena .cr-tasa { gap: 4px; padding: 8px 13px; }
.ay-escena .cr-tasa .k-h2 { font-size: 12px; }
.ay-escena .cr-grande { font-size: 18px; font-weight: 800; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.ay-escena .cr-tasa .k-btn { align-self: center; }
.ay-escena .cr-estado { display: flex; align-items: flex-start; gap: 5px; font-size: 10px; }
.ay-escena .cr-estado .k-ic { color: var(--k-exito, #167A52); margin-top: 1px; }
.ay-escena .cr-ref { font-size: 10px; }

/* ---------- tablas de caja y de reportes ---------- */
.ay-escena .cr-tabla { border: 1px solid var(--k-borde, #E3DFD6); border-radius: 10px; background: #FFFFFF; overflow: hidden; }
.ay-escena .cr-tabla table { width: 100%; border-collapse: collapse; font-size: 10.5px; }
.ay-escena .cr-tabla th, .ay-escena .cr-tabla td { padding: 5px 9px; border-bottom: 1px solid var(--k-borde, #E3DFD6); text-align: left; white-space: nowrap; vertical-align: middle; }
.ay-escena .cr-tabla thead th { font-size: 9.5px; font-weight: 700; color: var(--k-texto2, #55555F); background: var(--k-sup2, #F4F4F7); }
.ay-escena .cr-tabla tbody th { font-weight: 600; }
.ay-escena .cr-tabla .der { text-align: right; font-variant-numeric: tabular-nums; }
.ay-escena .cr-tabla .fuerte { font-weight: 700; }
.ay-escena .cr-tabla tbody tr:last-child > * { border-bottom: 0; }
.ay-escena .cr-tabla tfoot th, .ay-escena .cr-tabla tfoot td { background: var(--k-sup2, #F4F4F7); border-top: 1px solid var(--k-borde-fuerte, #C8C8D7); border-bottom: 0; font-weight: 700; }
.ay-escena .cr-tabla tfoot tr + tr > * { border-top-color: var(--k-borde, #E3DFD6); }
.ay-escena .cr-tabla .cr-suave { color: var(--k-texto2, #55555F); font-weight: 400; }
.ay-escena .cr-medio { white-space: normal !important; line-height: 1.25; }
.ay-escena .cr-medio small { display: block; font-weight: 400; font-size: 9.5px; color: var(--k-texto2, #55555F); }
.ay-escena .cr-tabla th.cr-tit { font-weight: 400; }
.ay-escena .cr-tabla tfoot th.cr-tit { font-weight: 700; }
.ay-escena .cr-tabla tr.cr-sub > * { background: var(--k-sup2, #F4F4F7); color: var(--k-texto2, #55555F); }
.ay-escena .cr-dia::first-letter { text-transform: uppercase; }

/* diferencia: palabra, signo y figura; el color solo acompaña (caja.css, .caja-dif) */
.ay-escena .cr-dif { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ay-escena .cr-dif .k-ic { width: 12px; height: 12px; }
.ay-escena .cr-dif--cuadra { color: var(--k-exito, #167A52); }
.ay-escena .cr-dif--sobra { color: var(--k-aviso, #8A5A00); }
.ay-escena .cr-dif--falta { color: var(--k-error, #B32630); }
.ay-escena .cr-dif--nada { color: var(--k-texto2, #55555F); font-weight: 400; }

/* campo «contado»: el símbolo delante y el monto a la derecha */
.ay-escena .cr-cont { display: inline-flex; align-items: center; gap: 5px; justify-content: flex-end; }
.ay-escena .cr-num { width: 82px; height: 24px; justify-content: flex-end; font-weight: 700; font-variant-numeric: tabular-nums; }
.ay-escena .cr-num .ph { font-weight: 400; }

/* ---------- Mi caja ---------- */
.ay-escena .cr-abrir { gap: 7px; }
.ay-escena .cr-abrir .k-suave { font-size: 10.5px; line-height: 1.4; }
.ay-escena .cr-fondos { display: grid; grid-template-columns: repeat(2, 150px); gap: 10px; }
.ay-escena .cr-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }
.ay-escena .cr-campos .k-sel, .ay-escena .cr-campos .k-campo { max-width: 260px; }
.ay-escena .cr-sellada { gap: 7px; }
.ay-escena .cr-cambiaria { display: grid; gap: 4px; padding: 8px 12px; border-radius: 10px; background: var(--k-sup2, #F4F4F7); font-size: 10.5px; line-height: 1.4; }
.ay-escena .k-franja .cr-acc { margin-top: 4px; }
.ay-escena .k-franja .cr-pila span { font-size: 10.5px; }

/* ---------- Cajas abiertas ahora / Cajas anteriores ---------- */
.ay-escena .cr-ab { display: grid; gap: 8px; padding: 8px 12px; border-bottom: 1px solid var(--k-borde, #E3DFD6); }
.ay-escena .cr-ab:last-child { border-bottom: 0; }
.ay-escena .cr-ab__cab { display: flex; align-items: center; gap: 8px; }
.ay-escena .cr-ab__cab .crece { flex: 1; min-width: 0; font-size: 11px; }
.ay-escena .cr-ab__cab small { display: block; color: var(--k-texto2, #55555F); font-size: 10px; }
.ay-escena .cr-ab__det { display: none; gap: 7px; padding-bottom: 2px; }
.ay-escena .cr-ab__det.ver { display: grid; }
.ay-escena .cr-ab__det .k-btn--fan { height: 18px; padding: 0 3px; vertical-align: middle; }
.ay-escena .cr-fechas { display: flex; gap: 8px; }
.ay-escena .cr-fechas .k-dato { width: 104px; }
.ay-escena .cr-fechas .k-campo { height: 26px; }
.ay-escena .cr-tabla td .k-btn--fan { height: 20px; }
.ay-escena .k-hoja[data-t="h-jose"], .ay-escena .k-hoja[data-t="h-carla"] { width: 540px; }

/* ---------- Reportes ---------- */
.ay-escena .cr-controles { display: grid; gap: 5px; justify-items: start; }
.ay-escena .cr-reporte { display: grid; gap: 12px; align-content: start; min-width: 0; }
.ay-escena .cr-muestra { font-size: 12.5px; font-weight: 600; }
.ay-escena .cr-resumen { display: grid; gap: 3px; margin: 0; padding: 8px 12px; border-radius: 10px; background: var(--k-sup2, #F4F4F7); max-width: 420px; font-size: 11px; }
.ay-escena .cr-resumen > div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; }
.ay-escena .cr-resumen dt { color: var(--k-texto2, #55555F); }
.ay-escena .cr-resumen > div:first-child dt { color: var(--k-texto, #1D1D24); font-weight: 600; }
.ay-escena .cr-resumen dd { margin: 0; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ay-escena .cr-barra-td { width: 26%; min-width: 80px; }
.ay-escena .cr-barra { display: block; height: 8px; border-radius: 3px; background: var(--k-sup3, #E9E9EF); overflow: hidden; }
.ay-escena .cr-barra > i { display: block; height: 100%; border-radius: 3px; background: var(--k-primario, #23255E); }
.ay-escena .cr-notas { display: grid; gap: 2px; padding-top: 8px; border-top: 1px solid var(--k-borde, #E3DFD6); color: var(--k-texto2, #55555F); font-size: 10px; }
.ay-escena .cr-notas b { color: var(--k-texto, #1D1D24); font-weight: 600; }
.ay-escena .cr-paso { display: block; font-weight: 600; }
.ay-escena .cr-que { display: block; white-space: normal; max-width: 300px; font-size: 9.5px; color: var(--k-texto2, #55555F); }
.ay-escena .cr-tabla th:has(.cr-que) { white-space: normal; }

/* estados de cita con su figura (clinica.css, .estado-cita) */
.ay-escena .cr-est { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; }
.ay-escena .cr-est::before { content: ""; width: 8px; height: 8px; border-radius: 50%; border: 2px solid currentColor; flex: none; box-sizing: border-box; }
.ay-escena .cr-est--confirmada::before { background: currentColor; }
.ay-escena .cr-est--llego { color: var(--k-aviso, #8A5A00); }
.ay-escena .cr-est--llego::before { border-radius: 2px; background: currentColor; }
.ay-escena .cr-est--en_sillon { color: var(--k-info, #3A3C8C); }
.ay-escena .cr-est--en_sillon::before { border-radius: 2px; transform: rotate(45deg); background: currentColor; }
.ay-escena .cr-est--atendida { color: var(--k-exito, #167A52); }
.ay-escena .cr-est--atendida::before { background: currentColor; }
.ay-escena .cr-est--no_vino { color: var(--k-error, #B32630); }
.ay-escena .cr-est--no_vino::before, .ay-escena .cr-est--cancelada::before { border-radius: 0; height: 2px; border-width: 1px; background: currentColor; }
.ay-escena .cr-est--cancelada { color: var(--k-texto2, #55555F); text-decoration: line-through; }

/* ---------- la ventana de imprimir del navegador ---------- */
.ay-escena .cr-imp { position: absolute; inset: 0; z-index: 40; display: grid; grid-template-columns: minmax(0, 1fr) 256px; background: #525659; opacity: 0; visibility: hidden; transition: opacity .25s, visibility 0s linear .25s; }
.ay-escena .cr-imp.ver { opacity: 1; visibility: visible; transition: opacity .25s; }
.ay-escena .cr-imp__vista { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 16px; overflow: hidden; }
.ay-escena .cr-papel { flex: none; width: 420px; height: 594px; background: #FFFFFF; box-shadow: 0 2px 10px rgba(0, 0, 0, .45); overflow: hidden; padding: 20px; }
.ay-escena .cr-papel__in { width: 580px; transform: scale(.655); transform-origin: 0 0; display: grid; gap: 10px; color: #1D1D24; }
.ay-escena .cr-papel__in .cr-tabla { border-color: var(--k-borde-fuerte, #C8C8D7); }
.ay-escena .cr-impcab { font-size: 12px; color: var(--k-texto2, #55555F); }
.ay-escena .cr-imp__panel { background: #FFFFFF; display: grid; grid-template-rows: auto 1fr auto; font-size: 11px; color: #202124; }
.ay-escena .cr-imp__cab { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 14px 16px 12px; font-size: 15px; font-weight: 600; }
.ay-escena .cr-imp__cab small { font-size: 10.5px; color: #5F6368; font-weight: 400; }
.ay-escena .cr-imp__ops { position: relative; padding: 4px 16px; display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 12px 8px; align-content: start; align-items: center; }
.ay-escena .cr-imp__et { color: #3C4043; font-size: 10.5px; }
.ay-escena .cr-imp__sel { display: flex; align-items: center; justify-content: space-between; gap: 6px; height: 26px; padding: 0 8px; border: 1px solid #DADCE0; border-radius: 4px; font-size: 10.5px; white-space: nowrap; overflow: hidden; }
.ay-escena .cr-imp__sel > span { display: inline-flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; }
.ay-escena .cr-imp__sel .k-ic { color: #5F6368; }
.ay-escena .cr-imp__mas { grid-column: 1 / -1; display: inline-flex; align-items: center; gap: 4px; color: #3C4043; font-size: 10.5px; }
.ay-escena .cr-imp__menu { position: absolute; left: 74px; right: 16px; top: 34px; z-index: 2; background: #FFFFFF; border-radius: 4px; box-shadow: 0 4px 16px rgba(0, 0, 0, .3); padding: 4px 0; display: grid; opacity: 0; visibility: hidden; transition: .15s; }
.ay-escena .cr-imp__menu.ver { opacity: 1; visibility: visible; }
.ay-escena .cr-imp__menu > span { display: flex; align-items: center; gap: 6px; padding: 7px 10px; font-size: 10.5px; }
.ay-escena .cr-imp__menu > span.sel { background: #E8F0FE; }
.ay-escena .cr-imp__menu .k-ic { color: #5F6368; }
.ay-escena .cr-imp__pie { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid #DADCE0; }
.ay-escena .cr-imp__pie span { padding: 6px 14px; border-radius: 4px; border: 1px solid #DADCE0; color: #1A73E8; font-weight: 600; }
.ay-escena .cr-imp__pie span.pri { background: #1A73E8; border-color: #1A73E8; color: #FFFFFF; }

/* ---------- «Guardar como» del sistema ---------- */
.ay-escena .cr-so { position: absolute; left: 50%; top: 50%; z-index: 46; width: 430px; transform: translate(-50%, -47%) scale(.97); background: #F3F3F3; border: 1px solid #C9C9C9; border-radius: 8px; box-shadow: 0 18px 44px rgba(0, 0, 0, .45); font-size: 11px; color: #1D1D24; opacity: 0; visibility: hidden; transition: .2s; overflow: hidden; }
.ay-escena .cr-so.ver { opacity: 1; visibility: visible; transform: translate(-50%, -50%); }
.ay-escena .cr-so__cab { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; background: #FFFFFF; }
.ay-escena .cr-so__cuerpo { display: grid; grid-template-columns: 110px minmax(0, 1fr); min-height: 110px; background: #FFFFFF; border-top: 1px solid #E1E1E1; border-bottom: 1px solid #E1E1E1; }
.ay-escena .cr-so__nav { padding: 8px; display: grid; gap: 3px; align-content: start; border-right: 1px solid #E1E1E1; }
.ay-escena .cr-so__nav span { padding: 3px 6px; border-radius: 4px; }
.ay-escena .cr-so__nav span.on { background: #CCE4F7; }
.ay-escena .cr-so__lista { padding: 8px; display: grid; gap: 4px; align-content: start; }
.ay-escena .cr-so__lista span { display: flex; align-items: center; gap: 6px; }
.ay-escena .cr-so__lista .k-ic { color: #C69214; }
.ay-escena .cr-so__campos { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 6px 8px; align-items: center; padding: 10px 12px; }
.ay-escena .cr-so__campo { height: 24px; border: 1px solid #8A8A8A; background: #FFFFFF; border-radius: 3px; padding: 0 6px; display: flex; align-items: center; white-space: nowrap; overflow: hidden; }
.ay-escena .cr-so__pie { display: flex; justify-content: flex-end; gap: 8px; padding: 0 12px 12px; }
.ay-escena .cr-so__pie span { min-width: 72px; text-align: center; padding: 5px 10px; border: 1px solid #C2C2C2; border-radius: 4px; background: #FDFDFD; }
.ay-escena .cr-so__pie span.pri { background: #0067C0; border-color: #0067C0; color: #FFFFFF; }
