.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); }
.colorPlaceholder { color: rgb(153, 153, 153) !important; border-color: rgb(153, 153, 153) !important; }
* { 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; }
.radius12 { border-radius: 12px !important; }
.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; }
.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; }
.clipTitle { margin-top: 24px; font-weight: bold; }
.clipUpload { border: 1px solid rgb(153, 153, 153); border-radius: 6px; text-align: center; color: rgb(102, 102, 102); }
.page { position: relative; display: flex; flex-direction: column; margin-top: 108px; padding: 48px 12px 12px; box-sizing: border-box; width: 500px; height: calc(calc(var(--vh, 1vh) * 100) - 132px); overflow: visible; border-radius: 6px; background-color: rgb(253, 250, 245); border: 1px solid rgb(232, 228, 220); box-shadow: rgba(0, 0, 0, 0.04) 0px 0px 80px inset; }
.pageTitle { flex: 0 0 auto; margin-top: 24px; }
.pageContent > .pageTitle { margin-top: 12px; margin-bottom: 12px; }
.recordPatientHead { padding: 0px 8px 4px 10px; }
.recordPatientHeadRow { display: flex; align-items: center; gap: 14px; }
.recordPatientHeadTrack { flex: 0 0 72px; width: 72px; display: flex; align-items: center; justify-content: center; }
.recordPatientHeadTrack .historiaClinicaDate { flex: 0 0 68px; }
.recordPatientHeadTitle { flex: 1 1 auto; min-width: 0px; font-weight: bold; letter-spacing: 0.02em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pageBody { flex: 1 1 auto; min-height: 0px; display: flex; flex-direction: column; overflow: hidden; }
.pageContent { flex: 1 1 auto; min-height: 0px; margin-top: 12px; padding-bottom: 8px; overflow: hidden auto; scrollbar-width: none; }
.pageContent::-webkit-scrollbar { display: none; }
.pageContent.pageContentScrolled { -webkit-mask-image: linear-gradient(to bottom, transparent 0px, #000 32px); mask-image: linear-gradient(to bottom, transparent 0px, #000 32px); }
.recordInput { padding: 6px 0px; }
.recordInputRow { display: flex; align-items: flex-start; gap: 8px; }
.recordInputRow .recordInputParagraph { flex: 1 1 0%; min-width: 0px; }
.recordInputCaption { margin: 2px 0px 0px; padding-left: 10px; font-size: 15px; line-height: 1.2; color: rgb(153, 153, 153); user-select: none; }
.recordInputParagraph:has(.formTextIcon) .recordInputCaption { padding-left: 40px; }
.recordInput.consultaFirma { width: 100%; box-sizing: border-box; margin-top: 24px; padding-bottom: 12px; }
.consultaFirmaPad { width: 50%; margin-left: auto; text-align: center; }
.consultaFirmaBox { display: flex; align-items: flex-end; justify-content: center; height: 60px; border-bottom: 1px solid rgb(153, 153, 153); }
.consultaFirmaLabel { margin-top: 4px; font-size: 12px; }
.consultaFirmaButton { margin-top: 6px !important; height: 32px !important; line-height: 32px !important; }
.consultaFirmaNote { margin-top: 10px; font-size: 14px; color: rgb(233, 121, 97); text-align: center; }
.recordInputHeader { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.recordInputHeaderTitle { display: block; width: 50%; box-sizing: border-box; }
*, ::before, ::after { cursor: default !important; }
.jxhtml, .jxbody { overflow: hidden; height: 100%; max-height: 100%; touch-action: manipulation; }
.formTopNo { margin-top: 0px !important; }
.formText { margin-top: 12px; line-height: 42px; border: 1px solid rgb(153, 153, 153); border-radius: 12px; background-color: rgb(255, 255, 255); transition: height 500ms, background-color 500ms linear, border-color 500ms linear, color 500ms linear; }
.formTextHide { display: none; }
.formTextIcon { display: inline-block; vertical-align: top; width: 40px; font-size: 22px; text-align: center; }
.formTextIcon svg path { fill: currentcolor; }
.formTextText { display: inline-block; vertical-align: top; width: calc(100% - 40px); min-height: 1.2em; text-align: left; color: rgb(0, 0, 0); caret-color: rgb(0, 0, 0); }
.formTextText.formTextMultiline { white-space: pre-wrap; overflow-wrap: anywhere; }
.formTextText.formTextLines { box-sizing: content-box; padding-top: 9px; padding-bottom: 9px; line-height: 24px; }
.formButton { display: inline-block; vertical-align: top; box-sizing: border-box; margin-top: 12px; width: 100%; height: 44px; line-height: 44px; border-bottom: 2px solid rgb(204, 204, 204); border-radius: 6px; font-size: 13px; font-weight: bold; text-align: center; background-color: var(--button-background-color); color: rgb(255, 255, 255); transition: 0.5s; }
.formButtonText { display: inline-block; }
:host { display: block; }
.jxhtml, .jxbody { width: auto; max-width: none; height: auto; min-height: 0; overflow: visible; background: none; }
.jxhtml { ; }
.jxbody { font-family: 'IBM Plex Sans', sans-serif; }
#dItemRecordPatient27 { position: relative; margin: 0; height: var(--jSheet, 640px); }
#dItemRecordPatient27 .pageContent { overflow: hidden; }
.clipUpload { overflow: hidden; }
.clipUpload img { filter: blur(5px); transform: scale(1.04); }