style.css 42 KB

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