.jxhtml { --body-background-color: #F8F9FC; --body-background-image: radial-gradient(circle at 1px 1px, rgba(0, 0, 0, 0.2) 1px, transparent 0); --body-background-size: 24px 24px; --bar-max-width: 100%; --bar-background: linear-gradient(to top, rgba(255, 244, 241, 0), rgba(251, 226, 210, 1)); --bar-background-color: #EAF5F6; --bar-box-shadow: none; --barContent-width: 100%; --button-background-color: #1B3557; --menu-box-shadow: 0 6px 6px 0 rgba(234, 229, 223, 1); --menuTitle-background-color: #000000; --menuButton-background-color: #F9F5F0; --menuButton-border-bottom: 2px solid #999999; --menuButton-border-bottom-color: #EFC9B1; --menuButton-box-shadow: rgb(255 244 241 / 100%) 0px -12px 12px 0px; --menuButton-color: #000000; --front-max-width: auto; --front-background: transparent; --front-box-shadow: none; --frontItem-text-align: center; --alert-background: rgba(234, 229, 223, 0.8); }
* { cursor: default; user-select: none; outline: none; }
.jxhtml { width: 100%; max-width: 100%; height: 100%; overflow-y: scroll; }
.jxbody { top: 0px; margin-left: 0px; margin-right: 0px; padding: 0px; width: 100%; max-width: 100%; height: 100%; min-height: 100%; background-color: var(--body-background-color); background-image: var(--body-background-image); background-attachment: fixed; background-size: var(--body-background-size); background-position: 0px 0px; color: var(--body-color); font-family: sans-serif; font-weight: 200; font-size: 18px; }
.jxbody::-webkit-scrollbar { display: none; }
img { pointer-events: none; }
svg { display: block; margin: auto; }
.clip { position: relative; margin-top: 108px; padding: 48px 12px 12px; box-sizing: border-box; width: 500px; border-radius: 12px; background-color: rgb(51, 51, 51); }
.clipClose { position: absolute; right: 18px; top: 12px; width: 24px; height: 24px; line-height: 24px; border: 2px solid rgb(134, 133, 133); border-radius: 50%; font-size: 0px; font-weight: bold; text-align: center; color: rgb(134, 133, 133); box-sizing: content-box; }
.clipClose::after { content: ""; position: absolute; top: 4px; left: 4px; width: 16px; height: 16px; background-color: currentcolor; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.75 2V4.25977C6.75 4.55802 6.85676 4.84673 7.05078 5.07324L12 10.8467L16.9492 5.07324C17.1432 4.84673 17.25 4.55802 17.25 4.25977V2H18.75V4.25977C18.75 4.91622 18.5151 5.55139 18.0879 6.0498L12.9873 12L18.0879 17.9502C18.5151 18.4486 18.75 19.0838 18.75 19.7402V22H17.25V19.7402C17.25 19.442 17.1432 19.1533 16.9492 18.9268L12 13.1523L7.05078 18.9268C6.85676 19.1533 6.75 19.442 6.75 19.7402V22H5.25V19.7402C5.25 19.0838 5.48489 18.4486 5.91211 17.9502L11.0117 12L5.91211 6.0498C5.48489 5.55139 5.25 4.91622 5.25 4.25977V2H6.75Z'/></svg>") center center / contain no-repeat; pointer-events: none; }
.clipFullscreen { position: absolute; right: 52px; top: 12px; width: 28px; height: 28px; border: 2px solid rgb(134, 133, 133); border-radius: 50%; display: flex; align-items: center; justify-content: center; box-sizing: border-box; color: rgb(134, 133, 133); cursor: pointer; }
.clipFullscreen svg { width: 16px; height: 16px; pointer-events: none; }
.clipFullscreen .clipFullscreenShut { display: none; }
.clipClamp { z-index: 4; position: absolute; left: 0px; right: 0px; margin: -24px auto; }
.userPatientPortraitFile { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; z-index: -1; }
.userPatientTitle { position: relative; z-index: 2; display: flex; align-items: center; height: 132px; padding: 0px 140px 0px 10px; text-align: left; }
.userPatientActions { display: none; align-items: flex-start; gap: 6px; padding: 0px; }
.jxbody:not(.phoneView) .userPatientTitleLive { display: none; }
.userPatientAction { display: flex; flex-direction: column; align-items: center; width: 62px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.userPatientActionCircle { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 52px; height: 52px; border-radius: 50%; background-color: rgb(27, 53, 87); box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 4px; }
.userPatientActionCircle > div { display: flex; align-items: center; justify-content: center; pointer-events: none; }
.userPatientActionCircle svg { width: 22px; height: 22px; fill: currentcolor; pointer-events: none; }
.userPatientActionLabel { margin-top: 6px; color: rgb(27, 53, 87); font-size: 14px; font-weight: bold; letter-spacing: 0.06em; line-height: 1.2; text-align: center; }
.historiaClinicaTrack { position: relative; isolation: isolate; overflow: visible; }
.historiaClinicaGroup { position: relative; display: flex; flex-direction: column; overflow: visible; padding-top: 36px; }
.historiaClinicaItem[data-hc-first="1"] { order: 1; flex-direction: column; align-items: stretch; gap: 10px; }
.historiaClinicaDemographicHead { display: flex; align-items: center; gap: 14px; min-width: 0px; }
.historiaClinicaDemographicId { flex: 1 1 0%; min-width: 0px; }
.historiaClinicaDemographicName { font-weight: bold; font-size: 20px; line-height: 1.2; word-break: break-word; }
.historiaClinicaDemographicDni { margin-top: 4px; font-size: 14px; line-height: 1.2; color: rgb(51, 51, 51); word-break: break-word; }
.historiaClinicaItem[data-hc-first="1"] .historiaClinicaText { flex: 0 0 auto; width: 100%; padding-left: 12px; }
.historiaClinicaItem[data-hc-first="1"] .historiaClinicaTitle { margin-top: 2px; }
.historiaClinicaSearch { order: 2; position: relative; z-index: 3; box-sizing: border-box; width: calc(100% - 24px); margin: 24px 12px 12px; }
.historiaClinicaFilterHead { display: flex; align-items: center; box-sizing: border-box; height: 42px; border-bottom: 1px solid rgb(153, 153, 153); user-select: none; cursor: pointer !important; }
.historiaClinicaFilterIcon { flex: 0 0 40px; fill: rgb(153, 153, 153); color: rgb(153, 153, 153); }
.historiaClinicaFilterText { flex: 1 1 0px; min-width: 0px; color: rgb(153, 153, 153); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.historiaClinicaFilterArrow { flex: 0 0 auto; margin: 0px 14px; }
.historiaClinicaFilterHidden { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 8px; }
.historiaClinicaFilterList { background-color: rgb(253, 250, 245); border-radius: 0px 0px 16px 16px; overflow: hidden; }
.historiaClinicaFilterOption { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-bottom: 1px dotted rgb(204, 204, 204); color: rgb(85, 85, 85); user-select: none; cursor: pointer !important; }
.historiaClinicaFilterOption:last-child { border-bottom: 0px; }
.historiaClinicaFilterOption input { appearance: none; box-sizing: border-box; flex: 0 0 18px; width: 18px; height: 18px; margin: 0px; border: 1.5px solid rgb(181, 181, 181); border-radius: 50%; background-color: transparent; background-repeat: no-repeat; background-position: center center; background-size: 12px 12px; cursor: pointer !important; }
.historiaClinicaFilterOption input:checked { border-color: rgb(61, 90, 133); background-color: rgb(61, 90, 133); background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 16 16%27%3E%3Cpath d=%27M3.2 8.2l3 3.1 6.6-6.8%27 fill=%27none%27 stroke=%27%23ffffff%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E"); }
.historiaClinicaLine { position: absolute; z-index: 2; left: 54px; width: 3px; margin-left: -1.5px; pointer-events: none; }
.historiaClinicaLine--other { top: 180px; bottom: 54px; background-color: rgb(61, 90, 133); }
.historiaClinicaItem[data-hc-first="1"] .historiaClinicaDate { background-color: rgb(61, 90, 133); }
.historiaClinicaDatePortrait { overflow: hidden; padding: 0px; background-color: rgb(255, 255, 255); border: 6px solid rgb(61, 90, 133); box-sizing: border-box; cursor: pointer; }
.historiaClinicaItem[data-hc-first="1"] .historiaClinicaDatePortrait { background-color: rgb(255, 255, 255); }
.historiaClinicaDatePortraitImg { display: block; width: 100%; height: 100%; object-fit: cover; }
.historiaClinicaDatePortraitIcon { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background-color: rgb(255, 255, 255); color: rgb(176, 176, 176); }
.historiaClinicaDatePortraitIcon svg { width: 32px; height: 32px; fill: currentcolor; }
.historiaClinicaItem { order: 3; box-sizing: border-box; display: flex; align-items: flex-start; gap: 14px; width: calc(100% - 24px); min-height: 84px; height: auto; margin: 12px; padding: 12px 18px 12px 8px; position: relative; border-radius: 34px; background-color: rgb(253, 250, 245); color: rgb(0, 0, 0); cursor: pointer; box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 4px, rgba(0, 0, 0, 0.04) 0px 0px 80px inset; }
.historiaClinicaDate { position: relative; z-index: 3; flex: 0 0 68px; width: 68px; height: 68px; border-radius: 50%; background-color: rgb(61, 90, 133); color: rgb(255, 255, 255); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; line-height: 1.15; font-weight: bold; font-size: 13px; }
.historiaClinicaDateTime { margin-top: 2px; font-size: 11px; font-weight: bold; }
.historiaClinicaText { flex: 1 1 0%; min-width: 0px; padding-bottom: 12px; }
.historiaClinicaTitle { font-weight: bold; letter-spacing: 0.02em; margin-top: 22px; text-transform: uppercase; white-space: normal; overflow: visible; word-break: break-word; }
.historiaClinicaPreview { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px 12px; margin-top: 8px; }
.historiaClinicaPreviewTitle { flex: 1 0 100%; width: 100%; margin-top: 12px; font-weight: 700; letter-spacing: 0.04em; line-height: 1.2; color: rgb(85, 85, 85); text-transform: uppercase; }
.historiaClinicaPreviewField { display: inline-flex; align-items: flex-start; gap: 5px; max-width: 100%; min-width: 0px; line-height: 1.25; color: rgb(51, 51, 51); }
.historiaClinicaPreviewIcon { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 14px; height: 14px; margin-top: 1px; }
.historiaClinicaPreviewIcon > div { width: 18px; height: 18px !important; margin-top: 4px !important; }
.historiaClinicaPreviewValue { min-width: 0px; white-space: normal; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.clipPage { overflow-y: scroll; scrollbar-width: none; padding: 12px; height: calc(calc(var(--vh, 1vh) * 100) - 216px); border-radius: 6px; background-color: rgb(236, 236, 236); }
.clipPage::-webkit-scrollbar { display: none; }
.pageModule { z-index: 5; position: absolute; padding: 6px 12px; border-top-right-radius: 4px; background-color: rgb(27, 53, 87); color: rgb(255, 255, 255); font-size: 14px; font-weight: bold; cursor: pointer; }
.clip .pageModule { right: 10px; }
.userPatientMic { position: absolute; z-index: 6; right: 28px; bottom: 28px; width: 56px; height: 56px; border-radius: 28px; overflow: hidden; background-color: rgb(204, 204, 204); color: rgb(255, 255, 255); display: flex; align-items: center; justify-content: flex-end; cursor: pointer; user-select: none; touch-action: none; transition: width 0.35s, height 0.45s, right 0.45s, bottom 0.45s, border-radius 0.45s; }
.userPatientMicCover { position: absolute; inset: 0px; opacity: 0; pointer-events: none; transition: opacity 0.3s; }
.userPatientMicLoad { position: absolute; inset: 0px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; transition: opacity 0.3s; pointer-events: none; }
.userPatientMicGear { margin: 0px; width: 36px; height: 36px; animation: 2s linear 0s infinite normal none running userPatientMicGear; }
.userPatientMicLoadText { font-size: 16px; font-weight: bold; color: rgb(255, 255, 255); }
.userPatientMicPreview { position: absolute; inset: 0px; box-sizing: border-box; padding: 24px 20px; overflow-y: auto; opacity: 0; pointer-events: none; color: rgb(51, 51, 51); cursor: default; user-select: text; touch-action: pan-y; transition: opacity 0.3s; }
.userPatientMicWave { flex: 1 1 auto; min-width: 0px; height: 32px; margin-left: 20px; opacity: 0; transition: opacity 0.2s; pointer-events: none; }
.userPatientMicIcon { flex: 0 0 56px; height: 56px; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.userPatientMicIcon svg { width: 26px; height: 26px; fill: currentcolor; pointer-events: none; }
*, ::before, ::after { cursor: default !important; }
.jxhtml, .jxbody { overflow: hidden; height: 100%; max-height: 100%; touch-action: manipulation; }
.formSelectDetectorArrow { float: right; margin: 18px 14px; border-top: 6px solid rgb(140, 140, 140); border-right: 6px solid transparent; border-left: 6px solid transparent; }
.userPatientAccesosEmpty { width: 100%; padding: 24px 12px; text-align: center; color: rgb(136, 136, 136); font-size: 14px; }
@keyframes userPatientMicGear { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
:host { display: block; }
.jxhtml, .jxbody { width: auto; max-width: none; height: auto; min-height: 0; overflow: visible; background: none; }
.jxhtml { --vh: 7.830508474576272px; --vw: 9.03954802259887px; }
.jxbody { font-family: 'IBM Plex Sans', sans-serif; }
#dItemUserPatient1 { position: relative; margin: 0; isolation: isolate; }
#dItemUserPatient1 .clipPage { position: relative; z-index: 1; height: var(--jPage, 560px); overflow: hidden; }
#dItemUserPatient1 .clipClamp { z-index: 8; transform: translateZ(0); }