style.css 23 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151
  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. .stag-primary-bg {
  45. background-color: var(--primary-color) !important;
  46. color: #fff;
  47. }
  48. .stag-primary-border {
  49. border-color: var(--primary-color) !important;
  50. }
  51. .navbar-brand {
  52. font-size: 25px;
  53. font-weight: 900;
  54. }
  55. .sidebar .nav-link {
  56. padding: .25rem 1rem;
  57. }
  58. .sidebar .nav-item {
  59. margin-right: 0;
  60. }
  61. .sidebar .nav-item .nav-child-list {
  62. list-style: none;
  63. }
  64. .sidebar .nav-item .nav-child-list .nav-item .nav-link {
  65. padding-left: 2.75rem;
  66. }
  67. .sidebar .if-not-collapsed, .sidebar .if-collapsed {
  68. display: none;
  69. }
  70. .sidebar .nav-item.nav-child-collapsed .if-collapsed {
  71. display: block;
  72. }
  73. .sidebar .nav-item:not(.nav-child-collapsed) .if-not-collapsed {
  74. display: block;
  75. }
  76. .sidebar .nav-item.nav-child-collapsed .nav-child-list {
  77. display: none;
  78. }
  79. .navbar-dark .nav-item .nav-link {
  80. color: #fff;
  81. }
  82. .dropdown-menu {
  83. margin-top: 7px;
  84. border-radius: 0;
  85. }
  86. .dropdown-item:not(:last-child) {
  87. border-bottom:1px solid #ddd;
  88. }
  89. main {
  90. padding:0 1rem;
  91. }
  92. /* ability to toggle the video pane (rhs) */
  93. .stag_rhs_toggle, .stag_rhs_toggle:hover {
  94. position: fixed;
  95. bottom: 0;
  96. right: 0;
  97. padding: 0.25rem 0.75rem;
  98. border-top-left-radius: 6px;
  99. background-color: var(--primary-color);
  100. color: #fff;
  101. z-index: 2;
  102. }
  103. body.stag_rhs_collapsed .v-split,
  104. body.stag_rhs_collapsed .app-right-panel {
  105. display: none !important;
  106. }
  107. .delete-column {
  108. width: 120px;
  109. }
  110. .m-negator {
  111. margin-left: -1.25rem !important;
  112. margin-right: -1.25rem !important;
  113. }
  114. .pl-3-5 {
  115. padding-left: 1.25rem !important;
  116. }
  117. .lh-24px {
  118. height: 24px;
  119. line-height: 24px;
  120. }
  121. .mcp-theme-1 *:not(i) {
  122. font-family: Verdana, sans-serif;
  123. font-size: 12px;
  124. }
  125. .mcp-theme-1 .font-size-11 {
  126. font-size: 11px;
  127. }
  128. .mcp-theme-1 .font-size-13 {
  129. font-size: 13px;
  130. }
  131. .mcp-theme-1 .font-size-14 {
  132. font-size: 14px;
  133. }
  134. .mcp-theme-1 .font-size-16 {
  135. font-size: 16px;
  136. }
  137. .mcp-theme-1 .font-underline {
  138. text-decoration: underline;
  139. }
  140. .mcp-theme-1 .on-hover-opaque {
  141. opacity: 0.6;
  142. }
  143. .mcp-theme-1 .on-hover-opaque:hover {
  144. opacity: 1;
  145. }
  146. .mcp-theme-1 .opacity-60 {
  147. opacity: .6;
  148. }
  149. .mcp-theme-1 .overflow-visible {
  150. overflow: visible;
  151. }
  152. .mcp-theme-1 .text-secondary-light {
  153. color: #c9ddef !important;
  154. }
  155. .mcp-theme-1 a, .mcp-theme-1 a:link {
  156. color: rgb(13, 89, 175);
  157. }
  158. .mcp-theme-1 .btn.btn-primary {
  159. background: rgb(13, 89, 175);
  160. border-color: rgb(13, 89, 175);
  161. box-shadow: none;
  162. }
  163. .mcp-theme-1 .nav-item {
  164. margin: 0;
  165. }
  166. .mcp-theme-1 .nav-link:hover {
  167. background: #e3e3e394;
  168. }
  169. .mcp-theme-1 .nav-link {
  170. border-top: 1px solid transparent;
  171. }
  172. .mcp-theme-1 .nav-link.active {
  173. border-top: 1px solid #f8f9fa;
  174. background: #e2e2e2;
  175. }
  176. .mcp-theme-1 .text-sm {
  177. font-size: 85%;
  178. }
  179. .mcp-theme-1 .text-sm-incl-children,
  180. .mcp-theme-1 .text-sm-incl-children *:not(i) {
  181. font-size: 0.8rem;
  182. }
  183. .mcp-theme-1 .minutes-label {
  184. width: 40px;
  185. }
  186. .mcp-theme-1 .memo-textarea {
  187. min-width: 200px;
  188. height: 60px;
  189. }
  190. .main-row {
  191. display: flex;
  192. flex-wrap: nowrap;
  193. margin-right: -15px;
  194. margin-left: -15px;
  195. }
  196. .main-row > .sidebar {
  197. width: 180px;
  198. min-width: 180px;
  199. }
  200. .main-row > main {
  201. flex-grow: 1;
  202. }
  203. html, body {
  204. height: 100%;
  205. }
  206. body>nav.navbar {
  207. height: 55px;
  208. }
  209. .stag-content {
  210. height: calc(100% - 55px);
  211. }
  212. [moe][large] form {
  213. width: 450px;
  214. }
  215. .moe-disabled[moe] {
  216. cursor: not-allowed;
  217. }
  218. .moe-disabled[moe] [start][show] {
  219. opacity: 0.5;
  220. pointer-events: none;
  221. }
  222. .mcp-theme-1 .stag-no-wrap-td {
  223. max-width: 260px;
  224. }
  225. .mcp-theme-1 .stag-no-wrap {
  226. max-width: 250px;
  227. overflow: hidden;
  228. text-overflow: ellipsis;
  229. white-space: nowrap;
  230. display: block;
  231. }
  232. .mcp-theme-1 .form-control.form-control-sm:not(.min-width-unset) {
  233. min-width: 200px;
  234. }
  235. .mcp-theme-1 [large] .form-control.form-control-sm {
  236. min-width: unset;
  237. }
  238. [wide] .form-control.form-control-sm {
  239. min-width: 480px;
  240. }
  241. [moe][center] [url]:not([show]) {
  242. position: fixed;
  243. top: 10%;
  244. max-height: 88%;
  245. overflow-y: auto;
  246. overflow-x: hidden;
  247. left: calc(50% - 250px);
  248. width: 500px;
  249. }
  250. [moe][center][wide] [url]:not([show]) {
  251. left: calc(50% - 400px);
  252. width: 800px;
  253. }
  254. [moe][center] [url]:not([show]) .form-control.form-control-sm {
  255. min-width: unset;
  256. max-width: 100%;
  257. }
  258. .mcp-theme-1 .width-200px {
  259. width: 200px !important;
  260. }
  261. .mcp-theme-1 .width-30px {
  262. width: 30px !important;
  263. }
  264. .mcp-theme-1 .width-50px {
  265. width: 50px !important;
  266. }
  267. .mcp-theme-1 .min-width-140px {
  268. min-width: 140px !important;
  269. }
  270. .mcp-theme-1 .min-width-200px {
  271. min-width: 200px !important;
  272. }
  273. .mcp-theme-1 .min-width-300px {
  274. min-width: 300px;
  275. }
  276. .mcp-theme-1 .width-100px {
  277. width: 100px;
  278. min-width: unset !important;
  279. max-width: unset !important;
  280. }
  281. .mcp-theme-1 .width-100pc {
  282. width: 100% !important;
  283. min-width: unset !important;
  284. }
  285. .mcp-theme-1 .max-width-200px {
  286. max-width: 200px;
  287. }
  288. .mcp-theme-1 .max-width-300px {
  289. max-width: 300px;
  290. }
  291. .mcp-theme-1 .outline-0 {
  292. outline: none !important;
  293. box-shadow: none !important;
  294. }
  295. .cancelled-item {
  296. opacity: 0.5;
  297. }
  298. .cancelled-item:not(.always-clickable) * {
  299. pointer-events: none;
  300. }
  301. .note-content {
  302. max-height: 300px;
  303. overflow-y: auto;
  304. }
  305. .note-content:not([auto-edit]) {
  306. padding: 1rem;
  307. padding-bottom: 0;
  308. cursor: pointer;
  309. position: relative;
  310. }
  311. .note-content:not(.cancelled):not([auto-edit]):not(.readonly):before {
  312. content: '(click to change)';
  313. display: block;
  314. color: #535353;
  315. padding-bottom: 0.3rem;
  316. }
  317. .mcp-theme-1 .ql-container, .mcp-theme-1 .ql-toolbar {
  318. border-left: 0;
  319. border-right: 0;
  320. }
  321. .mcp-theme-1 .ql-editor[contenteditable] {
  322. min-height: 100px;
  323. }
  324. .ql-container p {
  325. margin-top: 1rem;
  326. }
  327. .note-content ul {
  328. list-style: none !important;
  329. }
  330. .ql-editor ul > li::before {
  331. content: '';
  332. }
  333. .m-neg-4 {
  334. margin-left: -1.25rem;
  335. margin-right: -1.25rem;
  336. }
  337. .mcp-theme-1 .ql-toolbar .ql-formats * {
  338. font-size: 12px !important;
  339. }
  340. .mcp-theme-1 .ql-toolbar.ql-snow {
  341. padding: 3px;
  342. background: #f7f7f7;
  343. }
  344. .mcp-theme-1 .ql-snow .ql-picker {
  345. height: 22px;
  346. }
  347. .mcp-theme-1 .ql-snow.ql-toolbar button {
  348. height: 22px;
  349. width: 26px;
  350. }
  351. .rte-holder .ql-container p {
  352. margin-top: 0;
  353. margin-bottom: 0.3rem;
  354. }
  355. .note-section:not(.edit) .if-not-edit {
  356. display: block !important;
  357. }
  358. .note-section:not(.edit) div.if-not-edit {
  359. padding-left: 1rem;
  360. }
  361. .note-section:not(.edit):hover {
  362. background: #f6f9fc;
  363. cursor: pointer;
  364. }
  365. .note-signed-by-hcp .note-section:not(.edit):hover {
  366. background: #f6f9fc;
  367. cursor: auto;
  368. }
  369. .note-section.edit .if-edit {
  370. display: block !important;
  371. }
  372. .c-pointer {
  373. cursor: pointer;
  374. }
  375. .events-none {
  376. pointer-events: none;
  377. }
  378. .inset-comment p {
  379. margin-bottom: 0.3rem;
  380. }
  381. .inset-comment p:last-child {
  382. margin-bottom: 0 !important;
  383. }
  384. .note-section.edit {
  385. background: #f0f8ff7d;
  386. outline: 2px solid #9de3ff;
  387. }
  388. .note-section.edit .ql-editor,
  389. .note-section.edit .btn-default {
  390. background-color: #fff !important;
  391. }
  392. /*.note-section-item-row:not(:first-child) {
  393. padding-top: 10px;
  394. border-top: 1px solid #ccc;
  395. }*/
  396. /* override med ac css */
  397. #searchResults {
  398. z-index: 100001 !important;
  399. }
  400. input.search_field, textarea.search_field {
  401. background-position: right 7px center !important;
  402. padding-right: 23px !important;
  403. }
  404. .ansList:focus, .search_field:focus {
  405. background-color: #fff !important;
  406. }
  407. @media (min-width: 1000px) {
  408. .navbar.navbar-dark {
  409. height: 55px;
  410. position: fixed;
  411. top: 0;
  412. left: 0;
  413. width: 100%;
  414. z-index: 9999;
  415. }
  416. .main-row > .sidebar {
  417. width: 180px;
  418. min-width: 180px;
  419. position: fixed;
  420. left: 0;
  421. top: 55px;
  422. z-index: 8;
  423. height: calc(100% - 55px);
  424. overflow-y: overlay;
  425. }
  426. .main-row {
  427. padding-left: 180px;
  428. }
  429. .navbar.navbar-dark+[role="main"] {
  430. padding-top: 55px;
  431. }
  432. }
  433. .font-smaller {
  434. font-size: 11px !important;
  435. }
  436. .text-ellipsis {
  437. white-space: nowrap;
  438. overflow: hidden;
  439. text-overflow: ellipsis;
  440. }
  441. .outline-0 {
  442. outline: none !important;
  443. }
  444. .note-widget-item:hover {
  445. background: #eee;
  446. }
  447. .note-widget-title {
  448. background: #ccc !important;
  449. color: #333 !important;
  450. font-size: 12px !important;
  451. font-weight: bold !important;
  452. }
  453. .navbar-collapse.show {
  454. background: #1c4587;
  455. z-index: 999;
  456. padding: 0.5rem 1rem;
  457. margin: 0 -1rem;
  458. }
  459. .navbar-dark .nav-item .nav-link {
  460. font-size: 12px;
  461. white-space: nowrap;
  462. overflow: hidden;
  463. text-overflow: ellipsis;
  464. }
  465. #patient-search {
  466. min-width: 100px !important;
  467. max-width: 140px !important;
  468. }
  469. .suggestions-outer {
  470. top: calc(100% + 2px);
  471. background: #fff;
  472. border-radius: 3px;
  473. border: 1px solid #ccc;
  474. z-index: 9999;
  475. }
  476. .suggestions-outer {
  477. top: calc(100% + 2px);
  478. background: #fff;
  479. border-radius: 3px;
  480. border: 1px solid #ccc;
  481. z-index: 9999;
  482. max-height: 220px;
  483. overflow-y: auto;
  484. min-width: calc(100% - 0.5rem);
  485. right: 0.5rem;
  486. }
  487. .suggestions-outer .suggest-item, .suggestions-outer .no-suggest-items {
  488. padding: 0.25rem 0.5rem;
  489. text-decoration: none;
  490. font-size: 12px;
  491. }
  492. .suggestions-outer .no-suggest-items {
  493. color: #888;
  494. }
  495. .suggestions-outer .suggest-item.active {
  496. background: #ccc;
  497. }
  498. .suggestions-outer .suggest-item:hover {
  499. background: aliceblue;
  500. }
  501. .pro-dashboard-inline-calendar>.datepicker.datepicker-inline,
  502. .pro-dashboard-inline-calendar table.table-condensed {
  503. width: 100% !important;
  504. }
  505. .pro-dashboard-inline-calendar {
  506. border: 1px solid #ddd;
  507. border-radius: 3px
  508. }
  509. .pro-dashboard-inline-calendar table.table-condensed th {
  510. padding: 0.5rem 0;
  511. }
  512. .pro-dashboard-inline-calendar table.table-condensed td {
  513. padding: 0.25rem 0;
  514. }
  515. .pro-dashboard-inline-calendar table.table-condensed td[has-events] {
  516. background: #c5e4ff;
  517. }
  518. [v-cloak] {
  519. opacity: 0;
  520. }
  521. .patient-avatar {
  522. width: 50px;
  523. height: 50px;
  524. background: #ddd;
  525. display: inline-flex;
  526. align-items: center;
  527. justify-content: center;
  528. border-radius: 100%;
  529. }
  530. .large {
  531. font-size: 16px !important;
  532. }
  533. /* note templates */
  534. .note-template-container {
  535. position: absolute;
  536. z-index: 10002;
  537. background: #fff;
  538. border: 1px solid #ddd;
  539. border-radius: 3px;
  540. display: none;
  541. min-width: 200px;
  542. }
  543. .note-template-container .note-template-item {
  544. position: relative;
  545. height: 25px;
  546. }
  547. .note-template-container .note-template-item .note-template-text {
  548. border-bottom: 1px solid #eee;
  549. }
  550. .note-template-container .note-template-item .label {
  551. padding: 3px 6px;
  552. padding-right: 25px;
  553. white-space: nowrap;
  554. display: inline-flex;
  555. align-items: center;
  556. min-width: 120px;
  557. cursor: pointer;
  558. flex-grow: 1;
  559. }
  560. .note-template-container .note-template-item:hover,
  561. .note-template-container .note-template-item.selected {
  562. background: aliceblue;
  563. }
  564. .note-template-container .note-template-item .label>input[type="checkbox"] {
  565. pointer-events: none;
  566. margin: 0;
  567. margin-right: 4px;
  568. height: 11px;
  569. }
  570. .note-template-container .note-template-item:last-child label {
  571. border: 0;
  572. }
  573. .note-template-container .note-template-item .note-template-children {
  574. position: absolute;
  575. left: 100%;
  576. top: 0;
  577. background: #fff;
  578. border: 1px solid #ddd;
  579. border-radius: 3px;
  580. display: none;
  581. }
  582. /*.note-template-container .note-template-item.selected:hover>.note-template-children {
  583. display: block;
  584. }*/
  585. .note-template-container .note-template-item .has-children {
  586. position: absolute;
  587. right: 6px;
  588. top: 0;
  589. height: 25px;
  590. line-height: 25px;
  591. color: #bbb;
  592. }
  593. .note-template-container .note-template-item:hover>.has-children {
  594. color: #444;
  595. }
  596. .note-templates-underlay {
  597. position: fixed;
  598. top: 0;
  599. left: 0;
  600. height: 100%;
  601. width: 100%;
  602. background: rgba(0,0,0,0.13);
  603. display: none;
  604. z-index: 10001;
  605. }
  606. .note-template-container textarea {
  607. height: 100px;
  608. border-radius: 0;
  609. border-color: #ccc;
  610. padding: 5px 10px;
  611. display: block;
  612. }
  613. .note-template-buttons {
  614. position: absolute;
  615. bottom: 100%;
  616. right: 0;
  617. height: 27px;
  618. padding: 0 3px;
  619. background: #fff;
  620. }
  621. .note-template-buttons button {
  622. font-size: 10px;
  623. padding: 2px 5px;
  624. margin-left: 5px;
  625. border-radius: 2px;
  626. }
  627. .note-template-buttons button:first-child {
  628. margin-left: 0;
  629. }
  630. .note-template-output {
  631. position: absolute;
  632. bottom: calc(100% + 26px);
  633. left: 0;
  634. padding: 3px 6px;
  635. background: #f7f7f7;
  636. min-width: 100%;
  637. border-radius: 3px;
  638. }
  639. .note-template-output-text {
  640. }
  641. .note-template-output .note-template-output-line {
  642. font-size: 11px;
  643. width: max-content;
  644. max-width: 500px;
  645. margin: 0;
  646. }
  647. .note-template-set-chooser {
  648. height: 22px;
  649. line-height: 22px;
  650. padding: 0 0.22rem;
  651. font-size: 12px !important;
  652. }
  653. .ql-editor .note-template-output-line {
  654. white-space: normal;
  655. }
  656. [prefix="(+)"] a.plus-trigger {
  657. color: #23a923 !important;
  658. }
  659. [prefix="(-)"] a.minus-trigger {
  660. color: #a91e1e !important;
  661. }
  662. .rspace {
  663. width: 20px;
  664. display: inline-flex;
  665. text-align: center;
  666. justify-content: center;
  667. }
  668. .embed-mask {
  669. position: fixed;
  670. left: 0;
  671. top: 0;
  672. height: 100%;
  673. width: 100%;
  674. background: rgba(0, 0, 0, 0.1);
  675. z-index: 98;
  676. }
  677. .embed-section {
  678. background: #fff;
  679. z-index: 99;
  680. padding: 0;
  681. border: 1px solid #ccc;
  682. }
  683. .mask-text-addition {
  684. position: fixed;
  685. bottom: calc(50% - 60px);
  686. left: 0;
  687. width: 100%;
  688. text-align: center;
  689. font-size: 12px;
  690. z-index: 9999999;
  691. color: #000;
  692. }
  693. .note-summary p {
  694. margin-bottom: 0.25rem;
  695. }
  696. .aligned-icon {
  697. display: inline-block;
  698. width: 18px;
  699. text-align: center;
  700. }
  701. body #searchCount {
  702. display: none !important;
  703. }
  704. body .break-spaces {
  705. white-space: pre-wrap;
  706. }
  707. .stag-tooltip .stag-tooltip-content {
  708. display: none;
  709. min-width: 200px;
  710. }
  711. .stag-tooltip:hover .stag-tooltip-content {
  712. display: block;
  713. right: -10px;
  714. top: 100%;
  715. z-index: 1;
  716. }
  717. .gem-nodes .node {
  718. border: 1px solid #ddd;
  719. padding: 0.75rem;
  720. border-radius: 5px;
  721. }
  722. .gem-nodes>.node {
  723. border: 0 !important;
  724. padding-left: 0;
  725. padding-right: 0;
  726. }
  727. .gem-nodes>.node:first-child {
  728. margin-top: 0 !important;
  729. }
  730. .gem-nodes>.node>label {
  731. font-weight: bold;
  732. font-size: 14px;
  733. margin: 0;
  734. }
  735. .gem-nodes .subs .node:last-child {
  736. margin-bottom: 0 !important;
  737. }
  738. .gem-nodes>.node>.subs {
  739. padding-left: 0 !important;
  740. }
  741. .gem-nodes>.node>.subs>.node {
  742. background: #f2f2f2;
  743. }
  744. .gem-nodes>.node>.subs>.node>.subs>.node {
  745. background: #fff;
  746. }
  747. .gem-nodes .node span[field] {
  748. font-weight: bold;
  749. }
  750. body .node input[type="number"] {
  751. max-width: 70px;
  752. min-width: unset !important;
  753. }
  754. .section-edit-mask {
  755. top: 0;
  756. left: 0;
  757. width: 100%;
  758. height: 100%;
  759. }
  760. .signed-note {
  761. position: relative;
  762. pointer-events: none !important;
  763. }
  764. .signed-note::after {
  765. content: '';
  766. position: absolute;
  767. z-index: 2;
  768. cursor: not-allowed;
  769. left: 0;
  770. top: 0;
  771. width: 100%;
  772. height: 100%;
  773. background: rgba(0,0,0,0.01);
  774. }
  775. .slot-picker {
  776. padding: 4px;
  777. padding-right: 0;
  778. padding-bottom: 0;
  779. }
  780. .slot-picker.disabled {
  781. opacity: 0.5;
  782. pointer-events: none;
  783. cursor: not-allowed;
  784. }
  785. .slot-picker td {
  786. text-align: center;
  787. border: 1px solid #ddd !important;
  788. padding: 2px 5px;
  789. cursor: pointer;
  790. }
  791. .slot-picker th {
  792. border: 0 !important;
  793. }
  794. .slot-picker td:hover {
  795. background: aliceblue;
  796. }
  797. .slot-picker td.blocked {
  798. background: #ccc !important;
  799. cursor: not-allowed;
  800. }
  801. .slot-picker td.selected {
  802. background-image: linear-gradient(to bottom,#08c,#04c);
  803. background-repeat: repeat-x;
  804. color: #fff;
  805. }
  806. .pro-appointment-calendar.disabled {
  807. opacity: 0.5;
  808. pointer-events: none;
  809. cursor: not-allowed;
  810. }
  811. .pro-appointment-calendar .datepicker-inline {
  812. width: 195px;
  813. padding-left: 0;
  814. }
  815. .pro-appointment-calendar .datepicker td {
  816. height: 25px;
  817. }
  818. .datepicker td, .datepicker th {
  819. border: none !important;
  820. }
  821. .appt-form-col {
  822. width: 220px;
  823. }
  824. .appt-calendar-col {
  825. flex-grow: 1;
  826. }
  827. .appt-form td.fc-day.stag-selected {
  828. outline: 2px solid #007bff;
  829. background: #e5f2fd;
  830. }
  831. .appt-form .stag-current-appt {
  832. background: #89159cc7;
  833. color: #fff;
  834. border-color: #89159cc7;
  835. }
  836. .appt-form .stag-current-appt .fc-daygrid-event-dot {
  837. border-color: #fff;
  838. }
  839. .appt-form .fc .fc-toolbar.fc-header-toolbar {
  840. margin-bottom: 0.5rem;
  841. /*align-items: start;*/
  842. }
  843. .stag-calendar-header-extra {
  844. background: #cde8ff;
  845. padding: 3px 10px;
  846. margin-top: 7px;
  847. border-top-left-radius: 6px;
  848. border-top-right-radius: 6px;
  849. border: 1px solid #44a5f982;
  850. border-bottom: 0;
  851. }
  852. .stag-calendar-header-extra * {
  853. font-size: 14px !important;
  854. }
  855. /* call panel */
  856. #proCallComponent {
  857. padding-bottom: 150px;
  858. }
  859. .patient-queue {
  860. display: flex;
  861. flex-direction: column;
  862. position: fixed;
  863. left: 0;
  864. width: 100%;
  865. bottom: 0;
  866. z-index: 4;
  867. }
  868. .queue-item {
  869. width: 100px;
  870. padding: 0.5rem;
  871. padding-bottom: 0.25rem;
  872. text-align: center;
  873. cursor: pointer;
  874. }
  875. .queue-item:hover {
  876. background: aliceblue;
  877. }
  878. .current-work-indicator {
  879. /*
  880. position: fixed;
  881. top: 55px;
  882. right: 0;
  883. z-index: 9999;
  884. */
  885. background: #305ba0;
  886. color: #fff;
  887. font-size: 12px;
  888. padding: 3px 8px;
  889. border-radius: 3px;
  890. /* border-bottom-left-radius: 5px;*/
  891. }
  892. /* stag popups */
  893. .stag-popup {
  894. position: fixed;
  895. left: 0;
  896. top: 55px;
  897. width: 100%;
  898. height: calc(100% - 55px);
  899. overflow-x: auto;
  900. z-index: 97;
  901. justify-content: center;
  902. align-items: center;
  903. display: none;
  904. background: center center no-repeat scroll rgba(0, 0, 0, 0.1);
  905. padding: 2rem 0;
  906. }
  907. .stag-popup.show {
  908. display: block;
  909. }
  910. .stag-popup>form {
  911. width: 80%;
  912. background: #fff;
  913. border: 1px solid #aaa;
  914. border-radius: 5px;
  915. overflow: hidden;
  916. box-shadow: 0 0 5px #ddd;
  917. margin: 0 auto;
  918. padding: 0.75rem;
  919. }
  920. .stag-popup.wide>form {
  921. width: calc(100% - 4rem);
  922. }
  923. .stag-popup.narrow>form {
  924. max-width: 500px;
  925. }
  926. .stag-popup.stag-popup-sm>form {
  927. max-width: 500px;
  928. }
  929. .stag-popup.stag-popup-md>form {
  930. max-width: 632pt;
  931. }
  932. .stag-popup.stag-popup-right>form {
  933. margin-right: 1.5rem;
  934. margin-left: auto;
  935. }
  936. .no-scroll {
  937. /*overflow: hidden;*/
  938. }
  939. .client-rs-contents p {
  940. margin-bottom: 0.25rem;
  941. }
  942. .pro-option {
  943. position: relative;
  944. display: block;
  945. padding-left: 30px;
  946. }
  947. .pro-option.pro-option-selected {
  948. display: inline-block;
  949. padding-left: 25px;
  950. }
  951. .pro-option .pro-option-initials {
  952. position: absolute;
  953. left: 5px;
  954. top: 2px;
  955. font-size: 10px;
  956. border-radius: 100%;
  957. height: 20px;
  958. width: 20px;
  959. line-height: 20px;
  960. text-align: center;
  961. font-weight: 400;
  962. }
  963. .pro-option.pro-option-selected .pro-option-initials {
  964. left: 3px;
  965. top: 0;
  966. font-size: 10px;
  967. border-radius: 100%;
  968. height: 18px;
  969. width: 18px;
  970. line-height: 19px;
  971. text-align: center;
  972. font-weight: 400;
  973. }
  974. span.pro-selection {
  975. padding: 0 5px;
  976. height: 18px;
  977. display: inline-block;
  978. border-top-right-radius: 3px;
  979. border-bottom-right-radius: 3px;
  980. }
  981. .select2-results__option--selectable {
  982. font-size: 13px;
  983. }
  984. #calendarApp .select2-selection__choice__display,
  985. #proCalendarApp .select2-selection__choice__display {
  986. padding: 0 !important;
  987. overflow: hidden !important;
  988. }
  989. span.select2-container.select2-container--default.select2-container--open {
  990. z-index: 999999;
  991. }
  992. .fc .fc-highlight {
  993. background: rgba(188, 232, 241, 0.6) !important;
  994. }
  995. .fc .add-overlay {
  996. padding: 1px 4px;
  997. display: inline-block;
  998. font-weight: bold;
  999. }
  1000. .fc .add-overlay.add-overlay-day-grid {
  1001. padding: 4px;
  1002. }
  1003. .stag-popup .stag-popup-title {
  1004. border-bottom: 1px solid #eee;
  1005. padding-bottom: 0.75rem;
  1006. margin-bottom: 1rem;
  1007. display: flex;
  1008. align-items: center;
  1009. }
  1010. .stag-popup .stag-popup-title>span {
  1011. font-size: 17px;
  1012. }
  1013. .fc .other-client {
  1014. box-shadow: 1px 1px 2px deeppink !important;
  1015. opacity: 0.5;
  1016. }
  1017. .fc .other-client:hover {
  1018. opacity: 0.8;
  1019. }
  1020. .fc .availability {
  1021. box-shadow: 0 0 3px green !important;
  1022. }
  1023. .fc .inactive-appointment {
  1024. opacity: 0.6;
  1025. box-shadow: 0 0 3px grey !important;
  1026. }
  1027. .fc .fc-button-primary:not(:disabled):active,
  1028. .fc .fc-button-primary:not(:disabled).fc-button-active {
  1029. border-color: #56a767 !important;
  1030. background-color: #56a767 !important;
  1031. }
  1032. .w-150 {
  1033. width: 150px !important;
  1034. min-width: 150px !important;
  1035. }
  1036. .w-180 {
  1037. width: 180px !important;
  1038. min-width: 180px !important;
  1039. }
  1040. .guest-view button.add-shortcut {
  1041. display: none;
  1042. }
  1043. .guest-view .note-section,
  1044. .guest-view .note-section:hover {
  1045. background: #fff !important;
  1046. }
  1047. #stagPdfViewer>form {
  1048. padding: 0;
  1049. background: #eee;
  1050. }
  1051. #stagPdfViewer>form .stag-popup-title {
  1052. background: #fff;
  1053. padding: 1rem;
  1054. }
  1055. canvas.pdf-viewer-page {
  1056. max-width: 100%;
  1057. margin: 1rem auto;
  1058. display: block;
  1059. box-shadow: 0 0 2px #aaa;
  1060. }
  1061. .hidden-link-input {
  1062. /*opacity: 0;
  1063. width: 0 !important;
  1064. border: 0 !important;
  1065. padding: 0 !important;*/
  1066. position: absolute;
  1067. left: -9999px;
  1068. }
  1069. table.table-edit-sheet tbody tr td {
  1070. padding: 0;
  1071. background: #f7f7f7;
  1072. }
  1073. table.table-edit-sheet tbody tr td>input,
  1074. table.table-edit-sheet tbody tr td>select {
  1075. box-shadow: none !important;
  1076. border-radius: 0 !important;
  1077. border: 0;
  1078. background: #fefefe;
  1079. width: 100% !important;
  1080. min-width: unset !important;
  1081. border-bottom: 1px solid #dee2e6;
  1082. }
  1083. table.table-edit-sheet tbody tr td>input:focus,
  1084. table.table-edit-sheet tbody tr td>select:focus {
  1085. background: #fff;
  1086. outline: 3px solid #4b88a633;
  1087. }
  1088. table.table-edit-sheet tbody tr [contenteditable] {
  1089. background: #fff;
  1090. }
  1091. table.table-edit-sheet .ql-toolbar {
  1092. border-top: 0 !important;
  1093. }
  1094. table.table-edit-sheet .ql-container {
  1095. border-bottom: 0 !important;
  1096. }
  1097. table.table-edit-sheet .ql-editor[contenteditable] {
  1098. min-height: 60px;
  1099. }
  1100. .w-35 {
  1101. width: 35%;
  1102. }
  1103. .client-single-dashboard .hide-if-dashboard {
  1104. display: none;
  1105. }
  1106. .notes-list .hide-if-note,
  1107. .note-section .hide-if-note {
  1108. display: none;
  1109. }
  1110. .data-option-list {
  1111. position: absolute;
  1112. background: #fff;
  1113. border: 1px solid #ddd;
  1114. margin-top: -1px;
  1115. width: 100%;
  1116. z-index: 1;
  1117. display: none;
  1118. }
  1119. input[data-option-list]:focus+.data-option-list {
  1120. display: block;
  1121. }
  1122. .data-option-list>div {
  1123. cursor: pointer;
  1124. padding: 0.3rem 0.5rem;
  1125. border-bottom: 1px solid #ddd;
  1126. color: #666;
  1127. }
  1128. .data-option-list>div:last-child {
  1129. border-bottom: 0;
  1130. }
  1131. .data-option-list>div:hover {
  1132. background: aliceblue;
  1133. }
  1134. .measurement-item:not(:last-child) {
  1135. border-bottom: 1px solid #e7e7e7;
  1136. }