style.css 42 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022
  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. top: 0;
  1501. }
  1502. .appointment-confirmation-history-trigger:hover .appointment-confirmation-history {
  1503. opacity: 1;
  1504. pointer-events: all;
  1505. }
  1506. .on-hover-text-reveal {
  1507. white-space: nowrap;
  1508. overflow: hidden;
  1509. text-overflow: ellipsis;
  1510. }
  1511. .on-hover-text-reveal:hover {
  1512. white-space: normal;
  1513. overflow: unset;
  1514. text-overflow: unset;
  1515. }
  1516. .collapsible-tbody.collapsed {
  1517. display: none;
  1518. }
  1519. #send-fax-pdf-preview, #transmit-pdf-preview {
  1520. max-height: 350px;
  1521. overflow: auto;
  1522. box-shadow: 0 0 2px #ccc;
  1523. }
  1524. canvas.pdf-viewer-page.pdf-preview-page {
  1525. margin: 0.5rem auto;
  1526. }
  1527. .back-to-admin-button {
  1528. background: transparent;
  1529. border: 0;
  1530. padding: 0;
  1531. color: rgb(13, 89, 175);
  1532. }
  1533. .back-to-admin-button:hover {
  1534. text-decoration: underline;
  1535. }
  1536. .bg-aliceblue {
  1537. background: aliceblue !important;
  1538. }
  1539. .filter-head input[type="date"]::-webkit-calendar-picker-indicator {
  1540. display: none;
  1541. -webkit-appearance: none;
  1542. }
  1543. .filter-head input[type="number"]::-webkit-inner-spin-button {
  1544. display: none;
  1545. -webkit-appearance: none;
  1546. }
  1547. .filter-head input[type="date"] {
  1548. padding: 0;
  1549. min-width: 90px;
  1550. }
  1551. .filter-head input[type="number"],
  1552. .filter-head input[type="date"] {
  1553. min-width: 90px;
  1554. }
  1555. .filter-head select {
  1556. padding: 0 5px;
  1557. }
  1558. tr.sep td {
  1559. padding: 0;
  1560. background: #eee;
  1561. height: 6px;
  1562. }
  1563. #practice-shipments-ready-to-print ::marker {
  1564. color: #0009;
  1565. font-size: 90%;
  1566. }
  1567. .only-print {
  1568. display: none;
  1569. }
  1570. @media print {
  1571. .only-print {
  1572. display: block;
  1573. }
  1574. th.only-print, td.only-print {
  1575. display: table-cell;
  1576. }
  1577. }
  1578. .only-screen {
  1579. display: block;
  1580. }
  1581. th.only-screen, td.only-screen {
  1582. display: table-cell;
  1583. }
  1584. @media print {
  1585. .only-screen {
  1586. display: none !important;
  1587. }
  1588. .only-pick-list, .only-order-slip {
  1589. display: none;
  1590. }
  1591. .pick-list .only-pick-list, .order-slip .only-order-slip {
  1592. display: block;
  1593. }
  1594. }
  1595. .suggest-item.patient-suggest>img {
  1596. width: 10px;
  1597. height: 10px;
  1598. opacity: 0.75;
  1599. }
  1600. .suggest-item.patient-suggest>img.claimed {
  1601. filter: grayscale(100%);
  1602. opacity: 0.5;
  1603. }
  1604. .pdf-viewer-auto {
  1605. max-height: 600px;
  1606. overflow: auto;
  1607. }
  1608. .ticket-popup .stag-popup.stag-slide.show {
  1609. position: static;
  1610. min-width: 100% !important;
  1611. max-width: unset !important;
  1612. padding-bottom: 2rem;
  1613. }
  1614. .ticket-popup .stag-popup.stag-slide.show form {
  1615. min-width: 100% !important;
  1616. max-width: unset !important;
  1617. }
  1618. .ticket-popup .stag-popup.stag-slide>form {
  1619. position: absolute;
  1620. top: 0;
  1621. height: auto !important;
  1622. overflow: hidden;
  1623. border-radius: 5px;
  1624. transition: none;
  1625. border: 1px solid #aaa;
  1626. }
  1627. .ticket-popup .stag-popup.stag-slide .stag-popup-title.sticky-top {
  1628. position: static;
  1629. }
  1630. .ticket-popup.stag-popup.stag-popup-md>.container-fluid {
  1631. max-width: 632pt;
  1632. }
  1633. .ticket-popup.stag-popup.stag-popup-md>.container-fluid>.main-row>main>.card {
  1634. border: 0;
  1635. /*background: transparent;*/
  1636. }
  1637. .ticket-popup .hide-inside-ticket-popup {
  1638. display: none !important;
  1639. }
  1640. .ticket-popup .disable-inside-ticket-popup {
  1641. pointer-events: none !important;
  1642. opacity: 0.5;
  1643. }
  1644. .fill-percent-value {
  1645. width: 60px;
  1646. }
  1647. .fill-percent-content {
  1648. width: 100px;
  1649. }
  1650. .fill-bar {
  1651. height: 20px !important;
  1652. border: 1px solid #ddd;
  1653. }
  1654. .if-in-clinic {
  1655. display: none;
  1656. }
  1657. .stag-table-container {
  1658. max-height: calc(100vh - 230px - 1rem);
  1659. width: 100%;
  1660. overflow: auto !important;
  1661. }
  1662. .stag-table-container-lg>table{
  1663. min-width: 1450px;
  1664. }
  1665. .stag-table-container.stag-table-container-no-x-scroll {
  1666. overflow-x: hidden !important;
  1667. }
  1668. .stag-fc-container .fc-toolbar-title .tz-display {
  1669. font-size: inherit;
  1670. font-family: inherit;
  1671. }
  1672. .caremonth-measurements-calendar .fc-event.m-weight {
  1673. background: #38908f;
  1674. color: #fff;
  1675. padding-left: 5px;
  1676. margin-bottom: 2px;
  1677. }
  1678. .caremonth-measurements-calendar .fc-event.m-bp {
  1679. background: #5e96ae;
  1680. color: #fff;
  1681. padding-left: 5px;
  1682. margin-bottom: 2px;
  1683. }
  1684. .caremonth-measurements-calendar .fc-event.m-weight *,
  1685. .caremonth-measurements-calendar .fc-event.m-bp *{
  1686. font-size: 10px !important;
  1687. }
  1688. .caremonth-measurements-calendar .fc-daygrid-event-dot {
  1689. display: none;
  1690. }
  1691. .pro-dashboard-inline-calendar>.ui-datepicker-inline {
  1692. width: 100%;
  1693. border: 0 !important;
  1694. }
  1695. .caremonth-measurements-calendar>.ui-datepicker-inline {
  1696. width: 100%;
  1697. }
  1698. .caremonth-measurements-calendar .ui-datepicker-prev,
  1699. .caremonth-measurements-calendar .ui-datepicker-next {
  1700. display: none;
  1701. }
  1702. #simpleSMSReminderComponent input[type="time"] {
  1703. max-width: 90px;
  1704. min-width: unset !important;
  1705. }
  1706. form.non-interactive .form-content {
  1707. opacity: 0.5;
  1708. cursor: not-allowed;
  1709. }
  1710. form.non-interactive .form-content * {
  1711. pointer-events: none;
  1712. }
  1713. #eventPros {
  1714. max-height: 28px;
  1715. opacity: 0;
  1716. }
  1717. .training-event {
  1718. position: relative;
  1719. background: #f0feff;
  1720. border-color: #32a2b89e !important;
  1721. }
  1722. .training-event::after {
  1723. position: absolute;
  1724. content: 'Training';
  1725. font-size: 10px;
  1726. font-weight: normal;
  1727. color: #17a2b8;
  1728. left: 1px;
  1729. bottom: -13px;
  1730. transform-origin: left top;
  1731. transform: rotate(
  1732. -90deg
  1733. );
  1734. width: 90px;
  1735. text-align: center;
  1736. letter-spacing: 0.75px;
  1737. }
  1738. .training-event .training-icon {
  1739. font-size: 22px;
  1740. color: #0d59af;
  1741. }
  1742. .training-event .patient-avatar {
  1743. border-color: #0d59af7d !important;
  1744. }
  1745. /* print-note */
  1746. @media print {
  1747. .stag-content #sidebarMenu {
  1748. display: none !important;
  1749. }
  1750. .stag-content .main-row {
  1751. padding-left: 0 !important;
  1752. }
  1753. .stag-content [moe] {
  1754. display: none !important;
  1755. }
  1756. .stag-content .screen-only {
  1757. display: none !important;
  1758. }
  1759. }
  1760. @media screen {
  1761. .stag-content .print-only {
  1762. display: none !important;
  1763. }
  1764. }
  1765. .child-sections>.note-section:not(.edit) {
  1766. position: relative;
  1767. }
  1768. .child-sections>.note-section:not(.edit):before {
  1769. content: '';
  1770. width: 9px;
  1771. border-top: 1px solid #ccc;
  1772. left: 0;
  1773. top: calc(1rem + 8px);
  1774. height: 1px;
  1775. position: absolute;
  1776. }
  1777. .child-sections>.note-section.edit {
  1778. margin-left: 1rem;
  1779. }
  1780. .rhs-absolute-fh-link {
  1781. position: absolute;
  1782. right: 0;
  1783. padding: 0 0.5rem;
  1784. background-color: inherit;
  1785. }
  1786. .mcp-theme-1 .click-to-copy {
  1787. background-color: #e4f7ed36;
  1788. cursor: copy;
  1789. border-bottom: 1px dotted #c0f7e86e;
  1790. }
  1791. .mcp-theme-1 .click-to-copy:hover {
  1792. border-bottom: 1px dotted #c0f7e8;
  1793. }
  1794. [data-type="removed"] {
  1795. color: gray;
  1796. font-style: italic;
  1797. }
  1798. [data-type="existing"] {
  1799. }
  1800. [data-type="updated"] {
  1801. font-weight: bold;
  1802. color: #d8a714;
  1803. }
  1804. [data-type="prescribed today"] {
  1805. font-weight: bold;
  1806. color: #2ea745
  1807. }
  1808. .process-notes-badge {
  1809. border: 1px solid #ddd;
  1810. cursor: pointer;
  1811. padding: 0.35rem 0.6rem;
  1812. border-radius: 4px;
  1813. text-decoration: none !important;
  1814. }
  1815. .process-notes-badge:hover {
  1816. color: #000 !important;
  1817. border-color: #349caf;
  1818. }
  1819. .process-notes-badge.active {
  1820. /*font-weight: bold;*/
  1821. color: #fff !important;
  1822. background: #349caf;
  1823. border-color: #349caf;
  1824. }
  1825. .process-notes-badge.success {
  1826. font-weight: bold;
  1827. color: #fff !important;
  1828. background: #31b574;
  1829. border-color: #31b574;
  1830. cursor: auto;
  1831. }
  1832. .process-notes-badge.error {
  1833. font-weight: bold;
  1834. color: #fff !important;
  1835. background: #a72132;
  1836. border-color: #a72132;
  1837. cursor: auto;
  1838. }
  1839. /*
  1840. .process-notes-badge {
  1841. position: relative;
  1842. }
  1843. .process-notes-badge:after {
  1844. position: absolute;
  1845. content: attr(data-index);
  1846. top: -14px;
  1847. left: 10px;
  1848. background: #fff;
  1849. border: 1px solid;
  1850. width: 20px;
  1851. text-align: center;
  1852. border-radius: 100%;
  1853. }*/
  1854. .no-overflow-menu {
  1855. overflow-y: auto;
  1856. max-height: calc(100vh - 60px);
  1857. }
  1858. .zero-height-field {
  1859. height: 1px !important;
  1860. opacity: 0 !important;
  1861. pointer-events: none;
  1862. position: absolute;
  1863. }
  1864. table.dashboard-stats-table th {
  1865. padding: 0.5rem 0.75rem
  1866. }
  1867. .min-height-500px {
  1868. min-height: 500px;
  1869. }
  1870. .inline-html-container p {
  1871. margin-bottom: 0;
  1872. }
  1873. body.in-iframe>.navbar {
  1874. display: none !important;
  1875. }
  1876. body.in-iframe .stag-content {
  1877. padding-top: 0 !important;
  1878. }
  1879. body.in-iframe .main-row > .sidebar {
  1880. top: 0;
  1881. height: 100%;
  1882. }
  1883. .stag-popup .hide-inside-popup {
  1884. display: none !important;
  1885. }
  1886. .strike-through {
  1887. text-decoration: line-through;
  1888. }
  1889. /* visit-moe */
  1890. [visit-moe] [url]:not([show]){
  1891. display: none;
  1892. }
  1893. [visit-moe] {
  1894. display: inline-block;
  1895. }
  1896. [visit-moe][relative] {
  1897. position: relative;
  1898. }
  1899. [visit-moe] [url]:not([show]) {
  1900. z-index: 99999;
  1901. position: absolute;
  1902. background-color: white;
  1903. padding: 10px;
  1904. border: 1px solid gray;
  1905. }
  1906. [visit-moe][fixed-center] [url]:not([show]) {
  1907. position: fixed !important;
  1908. top: 50% !important;
  1909. left: 50% !important;
  1910. width: 600px;
  1911. transform: translate(-50%, -50%) !important;
  1912. }
  1913. [visit-moe] [url][right] {
  1914. right: 0;
  1915. min-width: 200px;
  1916. }
  1917. [visit-moe][large] form, [visit-moe][large] [url] {
  1918. width: 450px;
  1919. }
  1920. [visit-moe][bottom] form {
  1921. bottom: 100%;
  1922. }
  1923. .note-container {
  1924. display: flex;
  1925. align-items: start;
  1926. }
  1927. .note-container .note-lhs-tree {
  1928. min-width: 220px;
  1929. max-width: 220px;
  1930. align-self: stretch;
  1931. border-right: 1px solid #ddd;
  1932. padding-top: 0.85rem;
  1933. height: 300px;
  1934. overflow: overlay;
  1935. max-height: calc(100vh - 55px);
  1936. background-color: #fff;
  1937. }
  1938. .note-container .note-lhs-tree.fixed {
  1939. position: fixed;
  1940. top: 55px;
  1941. max-height: calc(100vh - 55px) !important;
  1942. height: calc(100vh - 55px) !important;
  1943. }
  1944. .note-container .note-lhs-tree.fixed ~ .note-rhs-content {
  1945. margin-left: 220px;
  1946. }
  1947. .note-container .note-lhs-tree .note-tree-node.note-tree-heading>a {
  1948. }
  1949. .note-container .note-lhs-tree .note-tree-node>a {
  1950. display: block;
  1951. padding: 0.15rem 0;
  1952. padding-left: 0.75rem;
  1953. white-space: nowrap;
  1954. text-overflow: ellipsis;
  1955. overflow: hidden;
  1956. text-decoration: none;
  1957. color: #333;
  1958. }
  1959. .note-container .note-lhs-tree .note-tree-node>a:hover {
  1960. background-color: aliceblue;
  1961. color: #0d59af !important;
  1962. }
  1963. .note-container .note-lhs-tree .note-tree-node:hover>a,
  1964. .note-container .note-lhs-tree .note-tree-node.hovered>a {
  1965. background-color: aliceblue;
  1966. }
  1967. .note-container .note-lhs-tree .note-tree-node.active>a {
  1968. font-weight: bold !important;
  1969. color: #0d59af !important;
  1970. }
  1971. .note-container .note-lhs-tree .note-tree-children>.note-tree-node>a {
  1972. padding-left: 2rem;
  1973. }
  1974. .note-container .note-lhs-tree .note-tree-children .note-tree-children>.note-tree-node>a {
  1975. padding-left: 4rem;
  1976. }
  1977. .note-container .note-rhs-content {
  1978. flex-grow: 1;
  1979. }
  1980. .spot-highlight {
  1981. background: aliceblue !important;
  1982. }
  1983. .on-click-menu [menu] {
  1984. position: absolute;
  1985. display: none;
  1986. top: 100%;
  1987. right: 0;
  1988. z-index: 1;
  1989. }