style.css 42 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018
  1. :root {
  2. --w-70: 70%;
  3. --primary-color: #1c4587;
  4. --bg-grey: #EDEEF1;
  5. }
  6. /* login css */
  7. .login-container {
  8. background-color: var(--bg-grey);
  9. }
  10. .login-header {
  11. font-size: 30px;
  12. font-weight: 100;
  13. }
  14. .login-form {
  15. padding: 50px;
  16. }
  17. .login-form label {
  18. font-size: 14px;
  19. color: #454859;
  20. }
  21. .login-form .form-control {
  22. height: calc(1.5em + 0.75rem + 0.3px);;
  23. }
  24. .bg-holder {
  25. background-image: url(/login-rhs.jpg);
  26. background-size: cover;
  27. }
  28. .login-container .logo {
  29. font-size: 35px;
  30. font-weight: 800;
  31. color: rgb(13, 89, 175);
  32. }
  33. .login-container small {
  34. font-size: 12px;
  35. color: #999;
  36. }
  37. /* end of login */
  38. .w-70 {
  39. width: var(--w-70);
  40. }
  41. .text-warning-mellow {
  42. color: #d8a714!important;
  43. }
  44. .bg-warning-mellow {
  45. background-color: #ffc10777 !important;
  46. }
  47. .text-link {
  48. color: rgb(13, 89, 175) !important;
  49. }
  50. .stag-primary-bg {
  51. background-color: var(--primary-color) !important;
  52. color: #fff;
  53. }
  54. .stag-primary-border {
  55. border-color: var(--primary-color) !important;
  56. }
  57. .navbar-brand {
  58. font-size: 16px !important;
  59. font-weight: 600;
  60. }
  61. .navbar-brand>img {
  62. max-width: 160px;
  63. }
  64. .sidebar .nav-link {
  65. padding: .25rem 1rem;
  66. }
  67. .sidebar .nav-item {
  68. margin-right: 0;
  69. }
  70. .sidebar .nav-item .nav-child-list {
  71. list-style: none;
  72. }
  73. .sidebar .nav-item .nav-child-list .nav-item .nav-link {
  74. padding-left: 2rem;
  75. }
  76. .sidebar .if-not-collapsed, .sidebar .if-collapsed {
  77. display: none;
  78. }
  79. .sidebar .nav-item.nav-child-collapsed .if-collapsed {
  80. display: block;
  81. }
  82. .sidebar .nav-item:not(.nav-child-collapsed) .if-not-collapsed {
  83. display: block;
  84. }
  85. .sidebar .nav-item.nav-child-collapsed .nav-child-list {
  86. display: none;
  87. }
  88. .navbar-dark .nav-item .nav-link {
  89. color: #fff;
  90. }
  91. .dropdown-menu {
  92. margin-top: 7px;
  93. border-radius: 0;
  94. min-width: 120px;
  95. }
  96. .dropdown-item:not(:last-child) {
  97. border-bottom:1px solid #ddd;
  98. }
  99. main {
  100. padding:0 1rem;
  101. }
  102. /* ability to toggle the video pane (rhs) */
  103. .stag_rhs_toggle, .stag_rhs_toggle:hover {
  104. position: fixed;
  105. bottom: 0;
  106. right: 0;
  107. padding: 0.25rem 0.75rem;
  108. border-top-left-radius: 6px;
  109. background-color: var(--primary-color);
  110. color: #fff;
  111. z-index: 2;
  112. }
  113. body.stag_rhs_collapsed .v-split,
  114. body.stag_rhs_collapsed .app-right-panel {
  115. display: none !important;
  116. }
  117. .delete-column {
  118. width: 120px;
  119. }
  120. .m-negator {
  121. margin-left: -1.25rem !important;
  122. margin-right: -1.25rem !important;
  123. }
  124. .pl-3-5 {
  125. padding-left: 1.25rem !important;
  126. }
  127. .lh-24px {
  128. height: 24px;
  129. line-height: 24px;
  130. }
  131. .mcp-theme-1 *:not(i) {
  132. font-family: Verdana, sans-serif;
  133. font-size: 12px;
  134. }
  135. .mcp-theme-1 .font-size-11 {
  136. font-size: 11px;
  137. }
  138. .mcp-theme-1 .font-size-13 {
  139. font-size: 13px;
  140. }
  141. .mcp-theme-1 .font-size-14 {
  142. font-size: 14px;
  143. }
  144. .mcp-theme-1 .font-size-16 {
  145. font-size: 16px;
  146. }
  147. .mcp-theme-1 .font-underline {
  148. text-decoration: underline;
  149. }
  150. .mcp-theme-1 .on-hover-opaque {
  151. opacity: 0.6;
  152. }
  153. .mcp-theme-1 .on-hover-opaque:hover {
  154. opacity: 1;
  155. }
  156. .mcp-theme-1 .opacity-0 {
  157. opacity: 0 !important;
  158. }
  159. .mcp-theme-1 .opacity-60 {
  160. opacity: .6;
  161. }
  162. .mcp-theme-1 .overflow-visible {
  163. overflow: visible;
  164. }
  165. .mcp-theme-1 .text-secondary-light {
  166. color: #c9ddef !important;
  167. }
  168. .mcp-theme-1 a, .mcp-theme-1 a:link {
  169. color: rgb(13, 89, 175);
  170. }
  171. .mcp-theme-1 .btn.btn-primary {
  172. background: rgb(13, 89, 175);
  173. border-color: rgb(13, 89, 175);
  174. box-shadow: none;
  175. }
  176. #sidebarMenu .mcp-theme-1 .nav-item {
  177. margin: 0;
  178. }
  179. #sidebarMenu .mcp-theme-1 .nav-link:hover {
  180. background: #e3e3e394;
  181. }
  182. #sidebarMenu .mcp-theme-1 .nav-link {
  183. border-top: 1px solid transparent;
  184. }
  185. #sidebarMenu .mcp-theme-1 .nav-link.active {
  186. border-top: 1px solid #f8f9fa;
  187. background: #e2e2e2;
  188. }
  189. .mcp-theme-1 .text-sm {
  190. font-size: 85%;
  191. }
  192. .mcp-theme-1 .text-sm-incl-children,
  193. .mcp-theme-1 .text-sm-incl-children *:not(i) {
  194. font-size: 0.8rem;
  195. }
  196. .mcp-theme-1 .minutes-label {
  197. width: 40px;
  198. }
  199. .mcp-theme-1 .memo-textarea {
  200. min-width: 200px;
  201. height: 60px;
  202. }
  203. .main-row {
  204. display: flex;
  205. flex-wrap: nowrap;
  206. margin-right: -15px;
  207. margin-left: -15px;
  208. }
  209. .main-row > .sidebar {
  210. width: 180px;
  211. min-width: 180px;
  212. }
  213. .main-row > main {
  214. flex-grow: 1;
  215. }
  216. html, body {
  217. height: 100%;
  218. }
  219. body>nav.navbar {
  220. height: 55px;
  221. }
  222. .stag-content {
  223. height: calc(100% - 55px);
  224. }
  225. [moe][large] form, [moe][large] [url] {
  226. width: 450px;
  227. }
  228. [moe][bottom] form {
  229. bottom: 100%;
  230. }
  231. .moe-disabled[moe] {
  232. cursor: not-allowed;
  233. }
  234. .moe-disabled[moe] [start][show] {
  235. opacity: 0.5;
  236. pointer-events: none;
  237. }
  238. .mcp-theme-1 .stag-no-wrap-td {
  239. max-width: 260px;
  240. }
  241. .mcp-theme-1 .stag-no-wrap {
  242. max-width: 250px;
  243. overflow: hidden;
  244. text-overflow: ellipsis;
  245. white-space: nowrap;
  246. display: block;
  247. }
  248. .mcp-theme-1 .form-control.form-control-sm:not(.min-width-unset) {
  249. min-width: 200px;
  250. }
  251. .mcp-theme-1 .min-width-unset>.form-control.form-control-sm {
  252. min-width: unset !important;
  253. }
  254. .mcp-theme-1 [large] .form-control.form-control-sm {
  255. min-width: unset;
  256. }
  257. [wide] .form-control.form-control-sm {
  258. min-width: 480px;
  259. }
  260. [moe][center] [url]:not([show]) {
  261. position: fixed;
  262. top: 10%;
  263. max-height: 88%;
  264. overflow-y: auto;
  265. overflow-x: hidden;
  266. left: calc(50% - 250px);
  267. width: 500px;
  268. }
  269. [moe][center][wide] [url]:not([show]) {
  270. left: calc(50% - 400px);
  271. width: 800px;
  272. }
  273. [moe][center] [url]:not([show]) .form-control.form-control-sm {
  274. min-width: unset;
  275. max-width: 100%;
  276. }
  277. .mcp-theme-1 .width-200px {
  278. width: 200px !important;
  279. }
  280. .mcp-theme-1 .width-300px {
  281. width: 300px !important;
  282. }
  283. .mcp-theme-1 .width-22px {
  284. width: 22px !important;
  285. }
  286. .mcp-theme-1 .width-30px {
  287. width: 30px !important;
  288. }
  289. .mcp-theme-1 .width-40px {
  290. width: 40px !important;
  291. }
  292. .mcp-theme-1 .width-50px {
  293. width: 50px !important;
  294. }
  295. .mcp-theme-1 .width-60px {
  296. width: 60px !important;
  297. }
  298. .mcp-theme-1 .width-70px {
  299. width: 70px !important;
  300. }
  301. .mcp-theme-1 .min-width-70px {
  302. min-width: 70px !important;
  303. }
  304. .mcp-theme-1 .width-90px {
  305. width: 90px !important;
  306. }
  307. .mcp-theme-1 .min-width-140px {
  308. min-width: 140px !important;
  309. }
  310. .mcp-theme-1 .min-width-200px {
  311. min-width: 200px !important;
  312. }
  313. .mcp-theme-1 .min-width-300px {
  314. min-width: 300px;
  315. }
  316. .mcp-theme-1 .min-width-500px {
  317. min-width: 500px !important;
  318. }
  319. .mcp-theme-1 .max-width-500px {
  320. max-width: 500px !important;
  321. }
  322. .mcp-theme-1 .min-width-700px {
  323. min-width: 700px !important;
  324. }
  325. .mcp-theme-1 .max-width-700px {
  326. max-width: 700px !important;
  327. }
  328. .mcp-theme-1 .width-100px {
  329. width: 100px;
  330. min-width: unset !important;
  331. max-width: unset !important;
  332. }
  333. .mcp-theme-1 .width-150px {
  334. width: 150px;
  335. min-width: unset !important;
  336. max-width: unset !important;
  337. }
  338. .mcp-theme-1 .width-100pc {
  339. width: 100% !important;
  340. min-width: unset !important;
  341. }
  342. .mcp-theme-1 .max-width-200px {
  343. max-width: 200px;
  344. }
  345. .mcp-theme-1 .max-width-300px {
  346. max-width: 300px;
  347. }
  348. .mcp-theme-1 .outline-0 {
  349. outline: none !important;
  350. box-shadow: none !important;
  351. }
  352. .cancelled-item {
  353. opacity: 0.5;
  354. }
  355. .cancelled-item:not(.always-clickable) * {
  356. pointer-events: none;
  357. }
  358. .note-content {
  359. max-height: 300px;
  360. overflow-y: auto;
  361. }
  362. .note-content:not([auto-edit]) {
  363. padding: 1rem;
  364. padding-bottom: 0;
  365. cursor: pointer;
  366. position: relative;
  367. }
  368. .note-content:not(.cancelled):not([auto-edit]):not(.readonly):before {
  369. content: '(click to change)';
  370. display: block;
  371. color: #535353;
  372. padding-bottom: 0.3rem;
  373. }
  374. .mcp-theme-1 .ql-container, .mcp-theme-1 .ql-toolbar {
  375. border-left: 0;
  376. border-right: 0;
  377. }
  378. .mcp-theme-1 .ql-editor[contenteditable] {
  379. min-height: 100px;
  380. }
  381. .ql-container p {
  382. margin-top: 1rem;
  383. }
  384. .note-content ul {
  385. list-style: none !important;
  386. }
  387. .ql-editor ul > li::before {
  388. content: '';
  389. }
  390. .m-neg-3 {
  391. margin-left: -1rem;
  392. margin-right: -1rem;
  393. }
  394. .m-neg-4 {
  395. margin-left: -1.25rem;
  396. margin-right: -1.25rem;
  397. }
  398. .mcp-theme-1 .ql-toolbar .ql-formats * {
  399. font-size: 12px !important;
  400. }
  401. .mcp-theme-1 .ql-toolbar.ql-snow {
  402. padding: 3px;
  403. background: #f7f7f7;
  404. }
  405. .mcp-theme-1 .ql-snow .ql-picker {
  406. height: 22px;
  407. }
  408. .mcp-theme-1 .ql-snow.ql-toolbar button {
  409. height: 22px;
  410. width: 26px;
  411. }
  412. .rte-holder .ql-container p {
  413. margin-top: 0;
  414. margin-bottom: 0.3rem;
  415. }
  416. .note-section:not(.edit) .if-not-edit {
  417. display: block !important;
  418. }
  419. .note-section:not(.edit) div.if-not-edit {
  420. padding-left: 1rem;
  421. }
  422. .note-section:not(.edit):hover {
  423. background: #f6f9fc;
  424. cursor: pointer;
  425. }
  426. .note-signed-by-hcp .note-section:not(.edit):hover {
  427. background: #f6f9fc;
  428. cursor: auto;
  429. }
  430. .note-section.edit .if-edit {
  431. display: block !important;
  432. }
  433. .c-pointer {
  434. cursor: pointer;
  435. }
  436. .events-none {
  437. pointer-events: none;
  438. }
  439. .blocking-overlay {
  440. opacity: 0 !important;
  441. cursor: default;
  442. }
  443. .inset-comment p {
  444. margin-bottom: 0.3rem;
  445. }
  446. .inset-comment p:last-child {
  447. margin-bottom: 0 !important;
  448. }
  449. .note-section.edit {
  450. background: #f0f8ff7d;
  451. outline: 2px solid #9de3ff;
  452. }
  453. .note-section.edit .ql-editor,
  454. .note-section.edit .btn-default {
  455. background-color: #fff !important;
  456. }
  457. /*.note-section-item-row:not(:first-child) {
  458. padding-top: 10px;
  459. border-top: 1px solid #ccc;
  460. }*/
  461. /* override med ac css */
  462. #searchResults {
  463. z-index: 100001 !important;
  464. }
  465. input.search_field, textarea.search_field {
  466. background-position: right 7px center !important;
  467. padding-right: 23px !important;
  468. }
  469. .ansList:focus, .search_field:focus {
  470. background-color: #fff !important;
  471. }
  472. @media (min-width: 1000px) {
  473. .navbar.navbar-dark {
  474. height: 55px;
  475. position: fixed;
  476. top: 0;
  477. left: 0;
  478. width: 100%;
  479. z-index: 9999;
  480. }
  481. .main-row > .sidebar {
  482. width: 180px;
  483. min-width: 180px;
  484. position: fixed;
  485. left: 0;
  486. top: 55px;
  487. z-index: 8;
  488. height: calc(100% - 55px);
  489. overflow-y: overlay;
  490. padding-bottom: 4rem;
  491. }
  492. .main-row {
  493. padding-left: 180px;
  494. }
  495. .navbar.navbar-dark+[role="main"] {
  496. padding-top: 55px;
  497. }
  498. .stag-popup .navbar.navbar-dark+[role="main"] {
  499. padding-top: 0;
  500. }
  501. }
  502. .font-smaller {
  503. font-size: 11px !important;
  504. }
  505. .text-ellipsis {
  506. white-space: nowrap;
  507. overflow: hidden;
  508. text-overflow: ellipsis;
  509. }
  510. .outline-0 {
  511. outline: none !important;
  512. }
  513. .note-widget-item:hover {
  514. background: #eee;
  515. }
  516. .note-widget-title {
  517. background: #ccc !important;
  518. color: #333 !important;
  519. font-size: 12px !important;
  520. font-weight: bold !important;
  521. }
  522. .navbar-collapse.show {
  523. background: #1c4587;
  524. z-index: 999;
  525. padding: 0.5rem 1rem;
  526. margin: 0 -1rem;
  527. }
  528. .navbar-dark .nav-item .nav-link {
  529. font-size: 12px;
  530. white-space: nowrap;
  531. overflow: hidden;
  532. text-overflow: ellipsis;
  533. }
  534. #patient-search {
  535. min-width: 90px !important;
  536. max-width: 140px !important;
  537. }
  538. .suggestions-outer {
  539. top: calc(100% + 2px);
  540. background: #fff;
  541. border-radius: 3px;
  542. border: 1px solid #ccc;
  543. z-index: 9999;
  544. }
  545. .suggestions-outer {
  546. top: calc(100% + 2px);
  547. background: #fff;
  548. border-radius: 3px;
  549. border: 1px solid #ccc;
  550. z-index: 9999;
  551. max-height: 220px;
  552. overflow-y: auto;
  553. min-width: calc(100% - 0.5rem);
  554. right: 0.5rem;
  555. }
  556. .suggestions-outer .suggest-item, .suggestions-outer .no-suggest-items {
  557. padding: 0.25rem 0.5rem;
  558. text-decoration: none;
  559. font-size: 12px;
  560. }
  561. .suggestions-outer .no-suggest-items {
  562. color: #888;
  563. }
  564. .suggestions-outer .suggest-item.active {
  565. background: #ccc;
  566. }
  567. .suggestions-outer .suggest-item:hover {
  568. background: aliceblue;
  569. }
  570. .pro-dashboard-inline-calendar>.datepicker.datepicker-inline,
  571. .pro-dashboard-inline-calendar table.table-condensed {
  572. width: 100% !important;
  573. }
  574. .pro-dashboard-inline-calendar {
  575. border: 1px solid #ddd;
  576. border-radius: 3px
  577. }
  578. .pro-dashboard-inline-calendar table.table-condensed th {
  579. padding: 0.5rem 0;
  580. border-radius: 0;
  581. }
  582. .pro-dashboard-inline-calendar table.table-condensed td {
  583. padding: 0.25rem 0;
  584. border-radius: 0;
  585. }
  586. .pro-dashboard-inline-calendar table.table-condensed td[has-events],
  587. .pro-dashboard-inline-calendar td.has-events:not(.ui-datepicker-today) a {
  588. background: #c5e4ff !important;
  589. font-weight: bold !important;
  590. color: #000 !important;
  591. }
  592. .caremonth-measurements-calendar table.table-condensed td[has-events],
  593. .caremonth-measurements-calendar td.has-events a {
  594. background: #c5e4ff !important;
  595. font-weight: bold !important;
  596. color: #000 !important;
  597. }
  598. .ui-state-active,
  599. .ui-widget-content .ui-state-active,
  600. .ui-widget-header .ui-state-active,
  601. a.ui-button:active,
  602. .ui-button:active,
  603. .ui-button.ui-state-active:hover {
  604. border: 1px solid #4396da !important;
  605. }
  606. .pro-dashboard-inline-calendar td.has-events.ui-datepicker-today a {
  607. font-weight: bold !important;
  608. color: #0d59af !important;
  609. }
  610. .pro-dashboard-inline-calendar td a {
  611. text-align: center !important;
  612. }
  613. [v-cloak] {
  614. opacity: 0;
  615. }
  616. .patient-avatar {
  617. width: 50px;
  618. height: 50px;
  619. background: #eee;
  620. display: inline-flex;
  621. align-items: center;
  622. justify-content: center;
  623. border-radius: 100%;
  624. border: 1px solid #ccc;
  625. }
  626. .large {
  627. font-size: 16px !important;
  628. }
  629. /* note templates */
  630. .note-template-container {
  631. position: absolute;
  632. z-index: 10002;
  633. background: #fff;
  634. border: 1px solid #ddd;
  635. border-radius: 3px;
  636. display: none;
  637. min-width: 200px;
  638. }
  639. .note-template-container .note-template-item {
  640. position: relative;
  641. height: 25px;
  642. }
  643. .note-template-container .note-template-item .note-template-text {
  644. border-bottom: 1px solid #eee;
  645. }
  646. .note-template-container .note-template-item .label {
  647. padding: 3px 6px;
  648. padding-right: 25px;
  649. white-space: nowrap;
  650. display: inline-flex;
  651. align-items: center;
  652. min-width: 120px;
  653. cursor: pointer;
  654. flex-grow: 1;
  655. }
  656. .note-template-container .note-template-item:hover,
  657. .note-template-container .note-template-item.selected {
  658. background: aliceblue;
  659. }
  660. .note-template-container .note-template-item .label>input[type="checkbox"] {
  661. pointer-events: none;
  662. margin: 0;
  663. margin-right: 4px;
  664. height: 11px;
  665. }
  666. .note-template-container .note-template-item:last-child label {
  667. border: 0;
  668. }
  669. .note-template-container .note-template-item .note-template-children {
  670. position: absolute;
  671. left: 100%;
  672. top: 0;
  673. background: #fff;
  674. border: 1px solid #ddd;
  675. border-radius: 3px;
  676. display: none;
  677. }
  678. /*.note-template-container .note-template-item.selected:hover>.note-template-children {
  679. display: block;
  680. }*/
  681. .note-template-container .note-template-item .has-children {
  682. position: absolute;
  683. right: 6px;
  684. top: 0;
  685. height: 25px;
  686. line-height: 25px;
  687. color: #bbb;
  688. }
  689. .note-template-container .note-template-item:hover>.has-children {
  690. color: #444;
  691. }
  692. .note-templates-underlay {
  693. position: fixed;
  694. top: 0;
  695. left: 0;
  696. height: 100%;
  697. width: 100%;
  698. background: rgba(0,0,0,0.13);
  699. display: none;
  700. z-index: 10001;
  701. }
  702. .note-template-container textarea {
  703. height: 100px;
  704. border-radius: 0;
  705. border-color: #ccc;
  706. padding: 5px 10px;
  707. display: block;
  708. }
  709. .note-template-buttons {
  710. position: absolute;
  711. bottom: 100%;
  712. right: 0;
  713. height: 27px;
  714. padding: 0 3px;
  715. background: #fff;
  716. }
  717. .note-template-buttons button {
  718. font-size: 10px;
  719. padding: 2px 5px;
  720. margin-left: 5px;
  721. border-radius: 2px;
  722. }
  723. .note-template-buttons button:first-child {
  724. margin-left: 0;
  725. }
  726. .note-template-output {
  727. position: absolute;
  728. bottom: calc(100% + 26px);
  729. left: 0;
  730. padding: 3px 6px;
  731. background: #f7f7f7;
  732. min-width: 100%;
  733. border-radius: 3px;
  734. }
  735. .note-template-output-text {
  736. }
  737. .note-template-output .note-template-output-line {
  738. font-size: 11px;
  739. width: max-content;
  740. max-width: 500px;
  741. margin: 0;
  742. }
  743. .note-template-set-chooser {
  744. height: 22px;
  745. line-height: 22px;
  746. padding: 0 0.22rem;
  747. font-size: 12px !important;
  748. }
  749. .ql-editor .note-template-output-line {
  750. white-space: normal;
  751. }
  752. [prefix="(+)"] a.plus-trigger {
  753. color: #23a923 !important;
  754. }
  755. [prefix="(-)"] a.minus-trigger {
  756. color: #a91e1e !important;
  757. }
  758. .rspace {
  759. width: 20px;
  760. display: inline-flex;
  761. text-align: center;
  762. justify-content: center;
  763. }
  764. .embed-mask {
  765. position: fixed;
  766. left: 0;
  767. top: 0;
  768. height: 100%;
  769. width: 100%;
  770. background: rgba(0, 0, 0, 0.1);
  771. z-index: 98;
  772. }
  773. .embed-section {
  774. background: #fff;
  775. z-index: 99;
  776. padding: 0;
  777. border: 1px solid #ccc;
  778. }
  779. .mask-text-addition {
  780. position: fixed;
  781. bottom: calc(50% - 60px);
  782. left: 0;
  783. width: 100%;
  784. text-align: center;
  785. font-size: 12px;
  786. z-index: 9999999;
  787. color: #000;
  788. }
  789. .note-summary p {
  790. margin-bottom: 0.25rem;
  791. }
  792. .aligned-icon {
  793. display: inline-block;
  794. width: 18px;
  795. text-align: center;
  796. }
  797. body #searchCount {
  798. display: none !important;
  799. }
  800. body .break-spaces {
  801. white-space: pre-wrap;
  802. }
  803. .stag-tooltip .stag-tooltip-content {
  804. display: none;
  805. min-width: 200px;
  806. }
  807. .stag-tooltip:hover .stag-tooltip-content {
  808. display: block;
  809. right: -10px;
  810. top: 100%;
  811. z-index: 1;
  812. }
  813. .gem-nodes .node {
  814. border: 1px solid #ddd;
  815. padding: 0.75rem;
  816. border-radius: 5px;
  817. }
  818. .gem-nodes>.node {
  819. border: 0 !important;
  820. padding-left: 0;
  821. padding-right: 0;
  822. }
  823. .gem-nodes>.node:first-child {
  824. margin-top: 0 !important;
  825. }
  826. .gem-nodes>.node>label {
  827. font-weight: bold;
  828. font-size: 14px;
  829. margin: 0;
  830. }
  831. .gem-nodes .subs .node:last-child {
  832. margin-bottom: 0 !important;
  833. }
  834. .gem-nodes>.node>.subs {
  835. padding-left: 0 !important;
  836. }
  837. .gem-nodes>.node>.subs>.node {
  838. background: #f2f2f2;
  839. }
  840. .gem-nodes>.node>.subs>.node>.subs>.node {
  841. background: #fff;
  842. }
  843. .gem-nodes .node span[field] {
  844. font-weight: bold;
  845. }
  846. body .node input[type="number"] {
  847. max-width: 70px;
  848. min-width: unset !important;
  849. }
  850. .section-edit-mask {
  851. top: 0;
  852. left: 0;
  853. width: 100%;
  854. height: 100%;
  855. }
  856. .signed-note {
  857. position: relative;
  858. pointer-events: none !important;
  859. }
  860. .signed-note::after {
  861. content: '';
  862. position: absolute;
  863. z-index: 2;
  864. cursor: not-allowed;
  865. left: 0;
  866. top: 0;
  867. width: 100%;
  868. height: 100%;
  869. background: rgba(0,0,0,0.01);
  870. }
  871. .slot-picker {
  872. padding: 4px;
  873. padding-right: 0;
  874. padding-bottom: 0;
  875. }
  876. .slot-picker.disabled {
  877. opacity: 0.5;
  878. pointer-events: none;
  879. cursor: not-allowed;
  880. }
  881. .slot-picker td {
  882. text-align: center;
  883. border: 1px solid #ddd !important;
  884. padding: 2px 5px;
  885. cursor: pointer;
  886. }
  887. .slot-picker th {
  888. border: 0 !important;
  889. }
  890. .slot-picker td:hover {
  891. background: aliceblue;
  892. }
  893. .slot-picker td.blocked {
  894. background: #ccc !important;
  895. cursor: not-allowed;
  896. }
  897. .slot-picker td.selected {
  898. background-image: linear-gradient(to bottom,#08c,#04c);
  899. background-repeat: repeat-x;
  900. color: #fff;
  901. }
  902. .pro-appointment-calendar.disabled {
  903. opacity: 0.5;
  904. pointer-events: none;
  905. cursor: not-allowed;
  906. }
  907. .pro-appointment-calendar .datepicker-inline {
  908. width: 195px;
  909. padding-left: 0;
  910. }
  911. .pro-appointment-calendar .datepicker td {
  912. height: 25px;
  913. }
  914. .datepicker td, .datepicker th {
  915. border: none !important;
  916. }
  917. .appt-form-col {
  918. width: 220px;
  919. }
  920. .appt-calendar-col {
  921. flex-grow: 1;
  922. }
  923. .appt-form td.fc-day.stag-selected {
  924. outline: 2px solid #007bff;
  925. background: #e5f2fd;
  926. }
  927. .appt-form .stag-current-appt {
  928. background: #89159cc7;
  929. color: #fff;
  930. border-color: #89159cc7;
  931. }
  932. .appt-form .stag-current-appt .fc-daygrid-event-dot {
  933. border-color: #fff;
  934. }
  935. .appt-form .fc .fc-toolbar.fc-header-toolbar {
  936. margin-bottom: 0.5rem;
  937. /*align-items: start;*/
  938. }
  939. .stag-calendar-header-extra {
  940. background: #cde8ff;
  941. padding: 3px 10px;
  942. margin-top: 7px;
  943. border-top-left-radius: 6px;
  944. border-top-right-radius: 6px;
  945. border: 1px solid #44a5f982;
  946. border-bottom: 0;
  947. }
  948. .stag-calendar-header-extra * {
  949. font-size: 14px !important;
  950. }
  951. /* call panel */
  952. #proCallComponent {
  953. padding-bottom: 150px;
  954. }
  955. .patient-queue {
  956. display: flex;
  957. flex-direction: column;
  958. position: fixed;
  959. left: 0;
  960. width: 100%;
  961. bottom: 0;
  962. z-index: 4;
  963. }
  964. .queue-item {
  965. width: 100px;
  966. padding: 0.5rem;
  967. padding-bottom: 0.25rem;
  968. text-align: center;
  969. cursor: pointer;
  970. }
  971. .queue-item:hover {
  972. background: aliceblue;
  973. }
  974. .current-work-indicator {
  975. /*
  976. position: fixed;
  977. top: 55px;
  978. right: 0;
  979. z-index: 9999;
  980. */
  981. background: #305ba0;
  982. color: #fff;
  983. font-size: 12px;
  984. padding: 3px 6px;
  985. border-radius: 3px;
  986. /* border-bottom-left-radius: 5px;*/
  987. white-space: nowrap;
  988. text-overflow: ellipsis;
  989. max-width: 100px;
  990. overflow: hidden;
  991. }
  992. /* stag popups */
  993. .stag-popup {
  994. position: fixed;
  995. left: 0;
  996. top: 55px;
  997. width: 100%;
  998. height: calc(100% - 55px);
  999. overflow-x: auto;
  1000. z-index: 97;
  1001. justify-content: center;
  1002. align-items: center;
  1003. display: none;
  1004. background: center center no-repeat scroll rgba(0, 0, 0, 0.1);
  1005. padding: 2rem 0;
  1006. }
  1007. .stag-popup.show {
  1008. display: block;
  1009. }
  1010. .stag-popup>form, .stag-popup>.stag-popup-content {
  1011. width: 80%;
  1012. background: #fff;
  1013. border: 1px solid #aaa;
  1014. border-radius: 5px;
  1015. overflow: hidden;
  1016. box-shadow: 0 0 5px #ddd;
  1017. margin: 0 auto;
  1018. padding: 0.75rem;
  1019. min-height: 220px;
  1020. }
  1021. .stag-popup.min-height-unset>form {
  1022. min-height: unset !important;
  1023. }
  1024. .stag-popup.wide>form, .stag-popup.wide>.stag-popup-content {
  1025. width: calc(100% - 4rem);
  1026. }
  1027. .stag-popup.tall>form, .stag-popup.tall>.stag-popup-content {
  1028. height: 100%;
  1029. min-height: 500px;
  1030. }
  1031. .stag-popup.narrow>form, .stag-popup.narrow>.stag-popup-content {
  1032. max-width: 500px;
  1033. }
  1034. .stag-popup.stag-popup-sm>form, .stag-popup.stag-popup-sm>.stag-popup-content {
  1035. max-width: 500px;
  1036. }
  1037. .stag-popup.stag-popup-md>form, .stag-popup.stag-popup-md>.stag-popup-content {
  1038. max-width: 632pt;
  1039. }
  1040. .stag-popup.stag-popup-right>form, .stag-popup.stag-popup-right>.stag-popup-content {
  1041. margin-right: 1.5rem;
  1042. margin-left: auto;
  1043. }
  1044. /* slide-in stag-popups */
  1045. .stag-popup.stag-slide {
  1046. display: block;
  1047. background: center center no-repeat scroll rgba(0, 0, 0, 0);
  1048. pointer-events: none;
  1049. overflow: hidden;
  1050. }
  1051. .stag-popup.stag-slide.show {
  1052. pointer-events: all;
  1053. }
  1054. .stag-popup.stag-slide>form {
  1055. position: absolute;
  1056. top: 0;
  1057. height: 100% !important;
  1058. overflow-y: auto;
  1059. border-radius: 0;
  1060. border-top: 0;
  1061. border-bottom: 0;
  1062. border-right: 0;
  1063. transition: right 0.3s ease;
  1064. width: 0;
  1065. }
  1066. .stag-popup.stag-slide.stag-popup-sm>form {
  1067. width: 500px;
  1068. right: -500px;
  1069. }
  1070. .stag-popup.stag-slide.stag-popup-md>form {
  1071. width: 632pt;
  1072. right: -632pt;
  1073. }
  1074. .stag-popup.stag-slide.show>form {
  1075. right: 0;
  1076. }
  1077. /* asana style ticket management */
  1078. .pro-initials {
  1079. border-radius: 100%;
  1080. height: 24px;
  1081. width: 24px;
  1082. min-height: 24px;
  1083. min-width: 24px;
  1084. max-height: 24px;
  1085. max-width: 24px;
  1086. text-align: center;
  1087. font-weight: 400;
  1088. display: inline-flex;
  1089. align-items: center;
  1090. justify-content: center;
  1091. background-color: #6457f9;
  1092. color: #fff;
  1093. font-size: 10px !important;
  1094. opacity: 0.85;
  1095. }
  1096. .pro-initials.pro-initials-sm {
  1097. height: 18px;
  1098. width: 18px;
  1099. min-height: 18px;
  1100. min-width: 18px;
  1101. max-height: 18px;
  1102. max-width: 18px;
  1103. font-size: 9px !important;
  1104. }
  1105. .pro-initials:hover {
  1106. opacity: 1;
  1107. }
  1108. .ticket-section {
  1109. }
  1110. .ticket-section.ticket-section-collapsed {
  1111. max-height: 0;
  1112. overflow: hidden;
  1113. }
  1114. .tickets-table tbody tr {
  1115. transition: background-color 0.2s ease;
  1116. }
  1117. .tickets-table tbody tr:hover {
  1118. background-color: rgba(0,0,0,.04);
  1119. }
  1120. .tickets-table tbody tr.current {
  1121. background-color: aliceblue;
  1122. }
  1123. .stag-slide input.form-control:not(:focus),
  1124. .stag-slide select.form-control:not(:focus) {
  1125. border-color: transparent;
  1126. background-color: transparent;
  1127. cursor: pointer;
  1128. font-weight: bold;
  1129. padding-left: 0;
  1130. }
  1131. .stag-slide select.form-control:not(:focus) {
  1132. appearance: none;
  1133. }
  1134. .stag-slide input.form-control {
  1135. box-shadow: none !important;
  1136. }
  1137. .stag-slide input.form-control:not(:focus):not([readonly]):hover {
  1138. text-decoration: underline;
  1139. }
  1140. .stag-slide input.form-control[readonly] {
  1141. opacity: 0.75;
  1142. }
  1143. .stag-slide ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  1144. color: #bbb !important;
  1145. font-weight: normal !important;
  1146. opacity: 1; /* Firefox */
  1147. }
  1148. .stag-slide :-ms-input-placeholder { /* Internet Explorer 10-11 */
  1149. color: #bbb !important;
  1150. font-weight: normal !important;
  1151. }
  1152. .stag-slide ::-ms-input-placeholder { /* Microsoft Edge */
  1153. color: #bbb !important;
  1154. font-weight: normal !important;
  1155. }
  1156. .stag-slide .text-success {
  1157. color: #00bf9c !important;
  1158. }
  1159. .stag-slide .btn-success,
  1160. .stag-slide .btn-success:hover {
  1161. background: #00bf9c;
  1162. border-color: #00bf9c;
  1163. }
  1164. .stag-slide .comment-input-outer {
  1165. position: sticky;
  1166. bottom: 0;
  1167. }
  1168. .stag-slide .txt-comment {
  1169. padding-bottom: calc(23px + 1rem);
  1170. height: calc(23px + 1rem);
  1171. transition: height 0.3s ease;
  1172. overflow: hidden;
  1173. }
  1174. .stag-slide .txt-comment:focus {
  1175. height: 120px;
  1176. overflow: auto;
  1177. }
  1178. .stag-slide .txt-comment:focus~.btn-save-comment {
  1179. opacity: 1;
  1180. }
  1181. .stag-slide .btn-save-comment {
  1182. position: absolute;
  1183. bottom: 0.5rem;
  1184. right: 0.5rem;
  1185. height: 28px;
  1186. line-height: 28px;
  1187. padding: 0 1rem;
  1188. transition: opacity 0.3s ease;
  1189. opacity: 0.5;
  1190. }
  1191. .stag-slide select.form-control:invalid,
  1192. .stag-slide input[type="text"].form-control:invalid {
  1193. background-color: #f8ecec;
  1194. padding-left: 0.5rem;
  1195. }
  1196. .stag-slide select:focus:invalid,
  1197. .stag-slide input[type="text"]:focus:invalid {
  1198. background: #fff;
  1199. border-color: #e24848;
  1200. box-shadow: 0 0 2px #c10707 !important;
  1201. }
  1202. .erx-line-item:nth-child(2n+1) {
  1203. background: #f0f8ffbb
  1204. }
  1205. .no-scroll {
  1206. overflow: hidden;
  1207. }
  1208. .client-rs-contents p {
  1209. margin-bottom: 0.25rem;
  1210. }
  1211. .pro-option {
  1212. position: relative;
  1213. display: block;
  1214. padding-left: 30px;
  1215. }
  1216. .pro-option.pro-option-selected {
  1217. display: inline-block;
  1218. padding-left: 25px;
  1219. }
  1220. .pro-option .pro-option-initials {
  1221. position: absolute;
  1222. left: 5px;
  1223. top: 2px;
  1224. font-size: 10px;
  1225. border-radius: 100%;
  1226. height: 20px;
  1227. width: 20px;
  1228. line-height: 20px;
  1229. text-align: center;
  1230. font-weight: 400;
  1231. }
  1232. .pro-option.pro-option-selected .pro-option-initials {
  1233. left: 3px;
  1234. top: 0;
  1235. font-size: 10px;
  1236. border-radius: 100%;
  1237. height: 18px;
  1238. width: 18px;
  1239. line-height: 19px;
  1240. text-align: center;
  1241. font-weight: 400;
  1242. }
  1243. span.pro-selection {
  1244. padding: 0 5px;
  1245. height: 18px;
  1246. display: inline-block;
  1247. border-top-right-radius: 3px;
  1248. border-bottom-right-radius: 3px;
  1249. }
  1250. .select2-results__option--selectable {
  1251. font-size: 13px;
  1252. }
  1253. #calendarApp .select2-selection__choice__display,
  1254. #proCalendarApp .select2-selection__choice__display {
  1255. padding: 0 !important;
  1256. overflow: hidden !important;
  1257. }
  1258. span.select2-container.select2-container--default.select2-container--open {
  1259. z-index: 999999;
  1260. }
  1261. .fc .fc-highlight {
  1262. background: rgba(188, 232, 241, 0.6) !important;
  1263. }
  1264. .fc .fc-day-past {
  1265. background: #e7e7e7 !important;
  1266. }
  1267. .fc .add-overlay {
  1268. padding: 1px 4px;
  1269. display: inline-block;
  1270. font-weight: bold;
  1271. }
  1272. .fc .add-overlay.add-overlay-day-grid {
  1273. padding: 4px;
  1274. }
  1275. .stag-popup .stag-popup-title {
  1276. border-bottom: 1px solid #eee;
  1277. padding-bottom: 0.75rem;
  1278. margin-bottom: 1rem;
  1279. display: flex;
  1280. align-items: center;
  1281. }
  1282. .stag-popup .stag-popup-title>span {
  1283. font-size: 17px;
  1284. }
  1285. .fc .other-client {
  1286. box-shadow: 1px 1px 2px deeppink !important;
  1287. opacity: 0.5;
  1288. }
  1289. .fc .other-client:hover {
  1290. opacity: 0.8;
  1291. }
  1292. .fc .availability {
  1293. box-shadow: 0 0 3px green !important;
  1294. }
  1295. .fc .inactive-appointment {
  1296. opacity: 0.6;
  1297. box-shadow: 0 0 3px grey !important;
  1298. }
  1299. .fc .fc-button-primary:not(:disabled):active,
  1300. .fc .fc-button-primary:not(:disabled).fc-button-active {
  1301. border-color: #56a767 !important;
  1302. background-color: #56a767 !important;
  1303. }
  1304. .w-150 {
  1305. width: 150px !important;
  1306. min-width: 150px !important;
  1307. }
  1308. .w-180 {
  1309. width: 180px !important;
  1310. min-width: 180px !important;
  1311. }
  1312. .guest-view button.add-shortcut {
  1313. display: none;
  1314. }
  1315. .guest-view .note-section,
  1316. .guest-view .note-section:hover {
  1317. background: #fff !important;
  1318. }
  1319. #stagPdfViewer>form {
  1320. padding: 0;
  1321. background: #eee;
  1322. }
  1323. #stagPdfViewer>form .stag-popup-title {
  1324. background: #fff;
  1325. padding: 1rem;
  1326. }
  1327. canvas.pdf-viewer-page {
  1328. max-width: 100%;
  1329. margin: 1rem auto;
  1330. display: block;
  1331. box-shadow: 0 0 2px #aaa;
  1332. }
  1333. .hidden-link-input {
  1334. /*opacity: 0;
  1335. width: 0 !important;
  1336. border: 0 !important;
  1337. padding: 0 !important;*/
  1338. position: absolute;
  1339. left: -9999px;
  1340. }
  1341. table.table-edit-sheet tbody tr td {
  1342. padding: 0;
  1343. background: #f7f7f7;
  1344. }
  1345. table.table-edit-sheet tbody tr td>input,
  1346. table.table-edit-sheet tbody tr td>select {
  1347. box-shadow: none !important;
  1348. border-radius: 0 !important;
  1349. border: 0;
  1350. background: #fefefe;
  1351. width: 100% !important;
  1352. min-width: unset !important;
  1353. border-bottom: 1px solid #dee2e6;
  1354. }
  1355. table.table-edit-sheet tbody tr td input[type="text"],
  1356. table.table-edit-sheet tbody tr td select,
  1357. table.table-edit-sheet tbody tr td textarea {
  1358. box-shadow: none !important;
  1359. border-radius: 0 !important;
  1360. border: 0;
  1361. background: #fefefe;
  1362. min-width: unset !important;
  1363. border-bottom: 1px solid #dee2e6;
  1364. }
  1365. table.table-edit-sheet tbody tr td>input:focus,
  1366. table.table-edit-sheet tbody tr td>select:focus {
  1367. background: #fff;
  1368. outline: 3px solid #4b88a633;
  1369. }
  1370. table.table-edit-sheet tbody tr [contenteditable] {
  1371. background: #fff;
  1372. }
  1373. table.table-edit-sheet .ql-toolbar {
  1374. border-top: 0 !important;
  1375. }
  1376. table.table-edit-sheet .ql-container {
  1377. border-bottom: 0 !important;
  1378. }
  1379. table.table-edit-sheet .ql-editor[contenteditable] {
  1380. min-height: 90px;
  1381. }
  1382. .w-35 {
  1383. width: 35%;
  1384. }
  1385. .client-single-dashboard .hide-if-dashboard {
  1386. display: none;
  1387. }
  1388. .notes-list .hide-if-note,
  1389. .note-section .hide-if-note {
  1390. display: none;
  1391. }
  1392. .data-option-list {
  1393. position: absolute;
  1394. background: #fff;
  1395. border: 2px solid #ddd;
  1396. margin-top: -1px;
  1397. width: 100%;
  1398. z-index: 1;
  1399. display: none;
  1400. max-width: 250px;
  1401. box-shadow: 0 0 3px #ddd;
  1402. border-top: 0;
  1403. }
  1404. .data-option-list>div {
  1405. cursor: pointer;
  1406. padding: 0.2rem 0.5rem;
  1407. border-bottom: 1px solid #ddd;
  1408. color: #666;
  1409. font-size: 90%;
  1410. }
  1411. .data-option-list>div:last-child {
  1412. border-bottom: 0;
  1413. }
  1414. .data-option-list>div:hover {
  1415. background: aliceblue;
  1416. }
  1417. .measurement-item:not(:last-child) {
  1418. border-bottom: 1px solid #e7e7e7;
  1419. }
  1420. .assessment-detail-template>span {
  1421. margin: 0 !important;
  1422. padding: 0 !important;
  1423. border: 0 !important;
  1424. margin-left: -0.5rem !important;
  1425. position: static !important;
  1426. }
  1427. .assessment-detail-template>span>a {
  1428. display: none;
  1429. }
  1430. button.add-shortcut,
  1431. button.note-templates-trigger-assessment {
  1432. outline: none !important;
  1433. box-shadow: none !important;
  1434. }
  1435. .appt-calendar-col.click-through .fc-timegrid-event-harness {
  1436. pointer-events: none !important;
  1437. }
  1438. .claim-line:last-child td {
  1439. padding-bottom: 1.3rem;
  1440. }
  1441. .in-table-markup p:last-of-type {
  1442. margin-bottom: 0;
  1443. }
  1444. .suggestions-outer.pharmacy-suggestions {
  1445. left: 1rem;
  1446. width: calc(100% - 2rem);
  1447. }
  1448. .flowsheets-table td {
  1449. padding: 0 10px;
  1450. height: 38px;
  1451. max-height: 38px;
  1452. min-height: 38px;
  1453. vertical-align: middle !important;
  1454. }
  1455. .flowsheets-table .expand {
  1456. display: none;
  1457. }
  1458. .flowsheets-table .collapse {
  1459. display: block;
  1460. }
  1461. .flowsheets-table .collapsed .expand {
  1462. display: block;
  1463. }
  1464. .flowsheets-table .collapsed .collapse {
  1465. display: none;
  1466. }
  1467. .flowsheets-table tr {
  1468. }
  1469. .flowsheets-table .collapsed tr:not(:first-child) {
  1470. display: none;
  1471. }
  1472. .col-2-button {
  1473. width: 88px;
  1474. text-align: left;
  1475. }
  1476. /* vitals graph */
  1477. .stag-chart {
  1478. min-height: 300px;
  1479. }
  1480. .stag-chart .safe-region>rect {
  1481. fill: green;
  1482. }
  1483. .stag-chart .safe-region>text {
  1484. fill: #888;
  1485. transform: translateY(-18px);
  1486. }
  1487. /* appt. confirmation history */
  1488. .appointment-confirmation-history-trigger .appointment-confirmation-history {
  1489. position: absolute;
  1490. width: 300px;
  1491. right: 0;
  1492. background: #fff;
  1493. opacity: 0;
  1494. padding: 0 0.75rem;
  1495. padding-bottom: 0.5rem;
  1496. box-shadow: 0 0 2px #999;
  1497. pointer-events: none;
  1498. transition: opacity 0.3s ease;
  1499. z-index: 2;
  1500. }
  1501. .appointment-confirmation-history-trigger:hover .appointment-confirmation-history {
  1502. opacity: 1;
  1503. pointer-events: all;
  1504. }
  1505. .on-hover-text-reveal {
  1506. white-space: nowrap;
  1507. overflow: hidden;
  1508. text-overflow: ellipsis;
  1509. }
  1510. /*.on-hover-text-reveal:hover {
  1511. white-space: normal;
  1512. overflow: unset;
  1513. text-overflow: unset;
  1514. }*/
  1515. .collapsible-tbody.collapsed {
  1516. display: none;
  1517. }
  1518. #send-fax-pdf-preview, #transmit-pdf-preview {
  1519. max-height: 350px;
  1520. overflow: auto;
  1521. box-shadow: 0 0 2px #ccc;
  1522. }
  1523. canvas.pdf-viewer-page.pdf-preview-page {
  1524. margin: 0.5rem auto;
  1525. }
  1526. .back-to-admin-button {
  1527. background: transparent;
  1528. border: 0;
  1529. padding: 0;
  1530. color: rgb(13, 89, 175);
  1531. }
  1532. .back-to-admin-button:hover {
  1533. text-decoration: underline;
  1534. }
  1535. .bg-aliceblue {
  1536. background: aliceblue !important;
  1537. }
  1538. .filter-head input[type="date"]::-webkit-calendar-picker-indicator {
  1539. display: none;
  1540. -webkit-appearance: none;
  1541. }
  1542. .filter-head input[type="number"]::-webkit-inner-spin-button {
  1543. display: none;
  1544. -webkit-appearance: none;
  1545. }
  1546. .filter-head input[type="date"] {
  1547. padding: 0;
  1548. min-width: 90px;
  1549. }
  1550. .filter-head input[type="number"],
  1551. .filter-head input[type="date"] {
  1552. min-width: 90px;
  1553. }
  1554. .filter-head select {
  1555. padding: 0 5px;
  1556. }
  1557. tr.sep td {
  1558. padding: 0;
  1559. background: #eee;
  1560. height: 6px;
  1561. }
  1562. #practice-shipments-ready-to-print ::marker {
  1563. color: #0009;
  1564. font-size: 90%;
  1565. }
  1566. .only-print {
  1567. display: none;
  1568. }
  1569. @media print {
  1570. .only-print {
  1571. display: block;
  1572. }
  1573. th.only-print, td.only-print {
  1574. display: table-cell;
  1575. }
  1576. }
  1577. .only-screen {
  1578. display: block;
  1579. }
  1580. th.only-screen, td.only-screen {
  1581. display: table-cell;
  1582. }
  1583. @media print {
  1584. .only-screen {
  1585. display: none !important;
  1586. }
  1587. .only-pick-list, .only-order-slip {
  1588. display: none;
  1589. }
  1590. .pick-list .only-pick-list, .order-slip .only-order-slip {
  1591. display: block;
  1592. }
  1593. }
  1594. .suggest-item.patient-suggest>img {
  1595. width: 10px;
  1596. height: 10px;
  1597. opacity: 0.75;
  1598. }
  1599. .suggest-item.patient-suggest>img.claimed {
  1600. filter: grayscale(100%);
  1601. opacity: 0.5;
  1602. }
  1603. .pdf-viewer-auto {
  1604. max-height: 600px;
  1605. overflow: auto;
  1606. }
  1607. .ticket-popup .stag-popup.stag-slide.show {
  1608. position: static;
  1609. min-width: 100% !important;
  1610. max-width: unset !important;
  1611. padding-bottom: 2rem;
  1612. }
  1613. .ticket-popup .stag-popup.stag-slide.show form {
  1614. min-width: 100% !important;
  1615. max-width: unset !important;
  1616. }
  1617. .ticket-popup .stag-popup.stag-slide>form {
  1618. position: absolute;
  1619. top: 0;
  1620. height: auto !important;
  1621. overflow: hidden;
  1622. border-radius: 5px;
  1623. transition: none;
  1624. border: 1px solid #aaa;
  1625. }
  1626. .ticket-popup .stag-popup.stag-slide .stag-popup-title.sticky-top {
  1627. position: static;
  1628. }
  1629. .ticket-popup.stag-popup.stag-popup-md>.container-fluid {
  1630. max-width: 632pt;
  1631. }
  1632. .ticket-popup.stag-popup.stag-popup-md>.container-fluid>.main-row>main>.card {
  1633. border: 0;
  1634. /*background: transparent;*/
  1635. }
  1636. .ticket-popup .hide-inside-ticket-popup {
  1637. display: none !important;
  1638. }
  1639. .ticket-popup .disable-inside-ticket-popup {
  1640. pointer-events: none !important;
  1641. opacity: 0.5;
  1642. }
  1643. .fill-percent-value {
  1644. width: 60px;
  1645. }
  1646. .fill-percent-content {
  1647. width: 100px;
  1648. }
  1649. .fill-bar {
  1650. height: 20px !important;
  1651. border: 1px solid #ddd;
  1652. }
  1653. .if-in-clinic {
  1654. display: none;
  1655. }
  1656. .stag-table-container {
  1657. max-height: calc(100vh - 230px - 1rem);
  1658. width: 100%;
  1659. overflow: auto !important;
  1660. }
  1661. .stag-table-container-lg>table{
  1662. min-width: 1450px;
  1663. }
  1664. .stag-table-container.stag-table-container-no-x-scroll {
  1665. overflow-x: hidden !important;
  1666. }
  1667. .stag-fc-container .fc-toolbar-title .tz-display {
  1668. font-size: inherit;
  1669. font-family: inherit;
  1670. }
  1671. .caremonth-measurements-calendar .fc-event.m-weight {
  1672. background: #38908f;
  1673. color: #fff;
  1674. padding-left: 5px;
  1675. margin-bottom: 2px;
  1676. }
  1677. .caremonth-measurements-calendar .fc-event.m-bp {
  1678. background: #5e96ae;
  1679. color: #fff;
  1680. padding-left: 5px;
  1681. margin-bottom: 2px;
  1682. }
  1683. .caremonth-measurements-calendar .fc-event.m-weight *,
  1684. .caremonth-measurements-calendar .fc-event.m-bp *{
  1685. font-size: 10px !important;
  1686. }
  1687. .caremonth-measurements-calendar .fc-daygrid-event-dot {
  1688. display: none;
  1689. }
  1690. .pro-dashboard-inline-calendar>.ui-datepicker-inline {
  1691. width: 100%;
  1692. border: 0 !important;
  1693. }
  1694. .caremonth-measurements-calendar>.ui-datepicker-inline {
  1695. width: 100%;
  1696. }
  1697. .caremonth-measurements-calendar .ui-datepicker-prev,
  1698. .caremonth-measurements-calendar .ui-datepicker-next {
  1699. display: none;
  1700. }
  1701. #simpleSMSReminderComponent input[type="time"] {
  1702. max-width: 90px;
  1703. min-width: unset !important;
  1704. }
  1705. form.non-interactive .form-content {
  1706. opacity: 0.5;
  1707. cursor: not-allowed;
  1708. }
  1709. form.non-interactive .form-content * {
  1710. pointer-events: none;
  1711. }
  1712. #eventPros {
  1713. max-height: 28px;
  1714. opacity: 0;
  1715. }
  1716. .training-event {
  1717. position: relative;
  1718. background: #f0feff;
  1719. border-color: #32a2b89e !important;
  1720. }
  1721. .training-event::after {
  1722. position: absolute;
  1723. content: 'Training';
  1724. font-size: 10px;
  1725. font-weight: normal;
  1726. color: #17a2b8;
  1727. left: 1px;
  1728. bottom: -13px;
  1729. transform-origin: left top;
  1730. transform: rotate(
  1731. -90deg
  1732. );
  1733. width: 90px;
  1734. text-align: center;
  1735. letter-spacing: 0.75px;
  1736. }
  1737. .training-event .training-icon {
  1738. font-size: 22px;
  1739. color: #0d59af;
  1740. }
  1741. .training-event .patient-avatar {
  1742. border-color: #0d59af7d !important;
  1743. }
  1744. /* print-note */
  1745. @media print {
  1746. .stag-content #sidebarMenu {
  1747. display: none !important;
  1748. }
  1749. .stag-content .main-row {
  1750. padding-left: 0 !important;
  1751. }
  1752. .stag-content [moe] {
  1753. display: none !important;
  1754. }
  1755. .stag-content .screen-only {
  1756. display: none !important;
  1757. }
  1758. }
  1759. @media screen {
  1760. .stag-content .print-only {
  1761. display: none !important;
  1762. }
  1763. }
  1764. .child-sections>.note-section:not(.edit) {
  1765. position: relative;
  1766. }
  1767. .child-sections>.note-section:not(.edit):before {
  1768. content: '';
  1769. width: 9px;
  1770. border-top: 1px solid #ccc;
  1771. left: 0;
  1772. top: calc(1rem + 8px);
  1773. height: 1px;
  1774. position: absolute;
  1775. }
  1776. .child-sections>.note-section.edit {
  1777. margin-left: 1rem;
  1778. }
  1779. .rhs-absolute-fh-link {
  1780. position: absolute;
  1781. right: 0;
  1782. padding: 0 0.5rem;
  1783. background-color: inherit;
  1784. }
  1785. .mcp-theme-1 .click-to-copy {
  1786. background-color: #e4f7ed36;
  1787. cursor: copy;
  1788. border-bottom: 1px dotted #c0f7e86e;
  1789. }
  1790. .mcp-theme-1 .click-to-copy:hover {
  1791. border-bottom: 1px dotted #c0f7e8;
  1792. }
  1793. [data-type="removed"] {
  1794. color: gray;
  1795. font-style: italic;
  1796. }
  1797. [data-type="existing"] {
  1798. }
  1799. [data-type="updated"] {
  1800. font-weight: bold;
  1801. color: #d8a714;
  1802. }
  1803. [data-type="prescribed today"] {
  1804. font-weight: bold;
  1805. color: #2ea745
  1806. }
  1807. .process-notes-badge {
  1808. border: 1px solid #ddd;
  1809. cursor: pointer;
  1810. padding: 0.35rem 0.6rem;
  1811. border-radius: 4px;
  1812. text-decoration: none !important;
  1813. }
  1814. .process-notes-badge:hover {
  1815. color: #000 !important;
  1816. border-color: #349caf;
  1817. }
  1818. .process-notes-badge.active {
  1819. /*font-weight: bold;*/
  1820. color: #fff !important;
  1821. background: #349caf;
  1822. border-color: #349caf;
  1823. }
  1824. .process-notes-badge.success {
  1825. font-weight: bold;
  1826. color: #fff !important;
  1827. background: #31b574;
  1828. border-color: #31b574;
  1829. cursor: auto;
  1830. }
  1831. .process-notes-badge.error {
  1832. font-weight: bold;
  1833. color: #fff !important;
  1834. background: #a72132;
  1835. border-color: #a72132;
  1836. cursor: auto;
  1837. }
  1838. /*
  1839. .process-notes-badge {
  1840. position: relative;
  1841. }
  1842. .process-notes-badge:after {
  1843. position: absolute;
  1844. content: attr(data-index);
  1845. top: -14px;
  1846. left: 10px;
  1847. background: #fff;
  1848. border: 1px solid;
  1849. width: 20px;
  1850. text-align: center;
  1851. border-radius: 100%;
  1852. }*/
  1853. .no-overflow-menu {
  1854. overflow-y: auto;
  1855. max-height: calc(100vh - 60px);
  1856. }
  1857. .zero-height-field {
  1858. height: 1px !important;
  1859. opacity: 0 !important;
  1860. pointer-events: none;
  1861. position: absolute;
  1862. }
  1863. table.dashboard-stats-table th {
  1864. padding: 0.5rem 0.75rem
  1865. }
  1866. .min-height-500px {
  1867. min-height: 500px;
  1868. }
  1869. .inline-html-container p {
  1870. margin-bottom: 0;
  1871. }
  1872. body.in-iframe>.navbar {
  1873. display: none !important;
  1874. }
  1875. body.in-iframe .stag-content {
  1876. padding-top: 0 !important;
  1877. }
  1878. body.in-iframe .main-row > .sidebar {
  1879. top: 0;
  1880. height: 100%;
  1881. }
  1882. .stag-popup .hide-inside-popup {
  1883. display: none !important;
  1884. }
  1885. .strike-through {
  1886. text-decoration: line-through;
  1887. }
  1888. /* visit-moe */
  1889. [visit-moe] [url]:not([show]){
  1890. display: none;
  1891. }
  1892. [visit-moe] {
  1893. display: inline-block;
  1894. }
  1895. [visit-moe][relative] {
  1896. position: relative;
  1897. }
  1898. [visit-moe] [url]:not([show]) {
  1899. z-index: 99999;
  1900. position: absolute;
  1901. background-color: white;
  1902. padding: 10px;
  1903. border: 1px solid gray;
  1904. }
  1905. [visit-moe][fixed-center] [url]:not([show]) {
  1906. position: fixed !important;
  1907. top: 50% !important;
  1908. left: 50% !important;
  1909. width: 600px;
  1910. transform: translate(-50%, -50%) !important;
  1911. }
  1912. [visit-moe] [url][right] {
  1913. right: 0;
  1914. min-width: 200px;
  1915. }
  1916. [visit-moe][large] form, [visit-moe][large] [url] {
  1917. width: 450px;
  1918. }
  1919. [visit-moe][bottom] form {
  1920. bottom: 100%;
  1921. }
  1922. .note-container {
  1923. display: flex;
  1924. align-items: start;
  1925. }
  1926. .note-container .note-lhs-tree {
  1927. min-width: 220px;
  1928. max-width: 220px;
  1929. align-self: stretch;
  1930. border-right: 1px solid #ddd;
  1931. padding-top: 0.85rem;
  1932. height: 300px;
  1933. overflow: overlay;
  1934. max-height: calc(100vh - 55px);
  1935. background-color: #fff;
  1936. }
  1937. .note-container .note-lhs-tree.fixed {
  1938. position: fixed;
  1939. top: 55px;
  1940. max-height: calc(100vh - 55px) !important;
  1941. height: calc(100vh - 55px) !important;
  1942. }
  1943. .note-container .note-lhs-tree.fixed ~ .note-rhs-content {
  1944. margin-left: 220px;
  1945. }
  1946. .note-container .note-lhs-tree .note-tree-node.note-tree-heading>a {
  1947. }
  1948. .note-container .note-lhs-tree .note-tree-node>a {
  1949. display: block;
  1950. padding: 0.15rem 0;
  1951. padding-left: 0.75rem;
  1952. white-space: nowrap;
  1953. text-overflow: ellipsis;
  1954. overflow: hidden;
  1955. text-decoration: none;
  1956. color: #333;
  1957. }
  1958. .note-container .note-lhs-tree .note-tree-node>a:hover {
  1959. background-color: aliceblue;
  1960. color: #0d59af !important;
  1961. }
  1962. .note-container .note-lhs-tree .note-tree-node.active>a {
  1963. background-color: aliceblue;
  1964. font-weight: bold !important;
  1965. color: #0d59af !important;
  1966. }
  1967. .note-container .note-lhs-tree .note-tree-children>.note-tree-node>a {
  1968. padding-left: 2rem;
  1969. }
  1970. .note-container .note-lhs-tree .note-tree-children .note-tree-children>.note-tree-node>a {
  1971. padding-left: 4rem;
  1972. }
  1973. .note-container .note-rhs-content {
  1974. flex-grow: 1;
  1975. }
  1976. .spot-highlight {
  1977. background: aliceblue !important;
  1978. }
  1979. .on-click-menu [menu] {
  1980. position: absolute;
  1981. display: none;
  1982. top: 100%;
  1983. right: 0;
  1984. z-index: 1;
  1985. }