trestle-tinymce 0.3.0 → 0.3.1

data/app/assets/javascripts/tinymce/skins/ui/trestle/skin.css

@@ -1,4 +1,5 @@
 .tox {
+  box-shadow: none;
   box-sizing: content-box;
   color: #222f3e;
   cursor: auto;
@@ -14,7 +15,7 @@
   vertical-align: initial;
   white-space: normal;
 }
-.tox *:not(svg) {
+.tox *:not(svg):not(rect) {
   box-sizing: inherit;
   color: inherit;
   cursor: inherit;
@@ -32,10 +33,11 @@
   vertical-align: inherit;
   white-space: inherit;
 }
-.tox *:not(svg) {
+.tox *:not(svg):not(rect) {
   /* stylelint-disable-line no-duplicate-selectors */
   background: transparent;
   border: 0;
+  box-shadow: none;
   float: none;
   height: auto;
   margin: 0;
@@ -70,8 +72,8 @@
   box-shadow: none;
 }
 .tox-tinymce-inline .tox-editor-header {
+  background-color: transparent;
   border: 1px solid #ccc;
-  border-bottom: 0;
   border-radius: 0.25rem;
   box-shadow: none;
 }
@@ -86,6 +88,9 @@
 button::-moz-focus-inner {
   border: 0;
 }
+.tox[dir=rtl] .tox-icon--flip svg {
+  transform: rotateY(180deg);
+}
 .tox .accessibility-issue__header {
   align-items: center;
   display: flex;
@@ -113,101 +118,101 @@ button::-moz-focus-inner {
 .tox .accessibility-issue__repair {
   margin-top: 16px;
 }
-.tox .accessibility-issue--info .accessibility-issue__description {
+.tox .tox-dialog__body-content .accessibility-issue--info .accessibility-issue__description {
   background-color: rgba(77, 107, 178, 0.1);
   border-color: #4d6bb2;
   color: #222f3e;
 }
-.tox .accessibility-issue--info .accessibility-issue__description > *:last-child {
+.tox .tox-dialog__body-content .accessibility-issue--info .accessibility-issue__description > *:last-child {
   border-color: #4d6bb2;
 }
-.tox .accessibility-issue--info h2 {
+.tox .tox-dialog__body-content .accessibility-issue--info .tox-form__group h2 {
   color: #4d6bb2;
 }
-.tox .accessibility-issue--info .tox-icon svg {
+.tox .tox-dialog__body-content .accessibility-issue--info .tox-icon svg {
   fill: #4d6bb2;
 }
-.tox .accessibility-issue--info a .tox-icon {
+.tox .tox-dialog__body-content .accessibility-issue--info a .tox-icon {
   color: #4d6bb2;
 }
-.tox .accessibility-issue--warn .accessibility-issue__description {
+.tox .tox-dialog__body-content .accessibility-issue--warn .accessibility-issue__description {
   background-color: rgba(255, 165, 0, 0.1);
   border-color: rgba(255, 165, 0, 0.5);
   color: #222f3e;
 }
-.tox .accessibility-issue--warn .accessibility-issue__description > *:last-child {
+.tox .tox-dialog__body-content .accessibility-issue--warn .accessibility-issue__description > *:last-child {
   border-color: rgba(255, 165, 0, 0.5);
 }
-.tox .accessibility-issue--warn h2 {
+.tox .tox-dialog__body-content .accessibility-issue--warn .tox-form__group h2 {
   color: #cc8500;
 }
-.tox .accessibility-issue--warn .tox-icon svg {
+.tox .tox-dialog__body-content .accessibility-issue--warn .tox-icon svg {
   fill: #cc8500;
 }
-.tox .accessibility-issue--warn a .tox-icon {
+.tox .tox-dialog__body-content .accessibility-issue--warn a .tox-icon {
   color: #cc8500;
 }
-.tox .accessibility-issue--error .accessibility-issue__description {
+.tox .tox-dialog__body-content .accessibility-issue--error .accessibility-issue__description {
   background-color: rgba(225, 117, 114, 0.1);
   border-color: rgba(225, 117, 114, 0.4);
   color: #222f3e;
 }
-.tox .accessibility-issue--error .accessibility-issue__description > *:last-child {
+.tox .tox-dialog__body-content .accessibility-issue--error .accessibility-issue__description > *:last-child {
   border-color: rgba(225, 117, 114, 0.4);
 }
-.tox .accessibility-issue--error h2 {
+.tox .tox-dialog__body-content .accessibility-issue--error .tox-form__group h2 {
   color: #e17572;
 }
-.tox .accessibility-issue--error .tox-icon svg {
+.tox .tox-dialog__body-content .accessibility-issue--error .tox-icon svg {
   fill: #e17572;
 }
-.tox .accessibility-issue--error a .tox-icon {
+.tox .tox-dialog__body-content .accessibility-issue--error a .tox-icon {
   color: #e17572;
 }
-.tox .accessibility-issue--success .accessibility-issue__description {
+.tox .tox-dialog__body-content .accessibility-issue--success .accessibility-issue__description {
   background-color: rgba(125, 198, 125, 0.1);
   border-color: rgba(125, 198, 125, 0.4);
   color: #222f3e;
 }
-.tox .accessibility-issue--success .accessibility-issue__description > *:last-child {
+.tox .tox-dialog__body-content .accessibility-issue--success .accessibility-issue__description > *:last-child {
   border-color: rgba(125, 198, 125, 0.4);
 }
-.tox .accessibility-issue--success h2 {
+.tox .tox-dialog__body-content .accessibility-issue--success .tox-form__group h2 {
   color: #7dc67d;
 }
-.tox .accessibility-issue--success .tox-icon svg {
+.tox .tox-dialog__body-content .accessibility-issue--success .tox-icon svg {
   fill: #7dc67d;
 }
-.tox .accessibility-issue--success a .tox-icon {
+.tox .tox-dialog__body-content .accessibility-issue--success a .tox-icon {
   color: #7dc67d;
 }
 .tox .tox-dialog__body-content .accessibility-issue__header h1,
 .tox .tox-dialog__body-content .tox-form__group .accessibility-issue__description h2 {
   margin-top: 0;
 }
-.tox:not([dir=rtl]) .accessibility-issue__header .tox-button {
+.tox:not([dir=rtl]) .tox-dialog__body-content .accessibility-issue__header .tox-button {
   margin-left: 4px;
 }
-.tox:not([dir=rtl]) .accessibility-issue__header > *:nth-last-child(2) {
+.tox:not([dir=rtl]) .tox-dialog__body-content .accessibility-issue__header > *:nth-last-child(2) {
   margin-left: auto;
 }
-.tox:not([dir=rtl]) .accessibility-issue__description {
+.tox:not([dir=rtl]) .tox-dialog__body-content .accessibility-issue__description {
   padding: 4px 4px 4px 8px;
 }
-.tox:not([dir=rtl]) .accessibility-issue__description > *:last-child {
+.tox:not([dir=rtl]) .tox-dialog__body-content .accessibility-issue__description > *:last-child {
   border-left-width: 1px;
   padding-left: 4px;
 }
-.tox[dir=rtl] .accessibility-issue__header .tox-button {
+.tox[dir=rtl] .tox-dialog__body-content .accessibility-issue__header .tox-button {
   margin-right: 4px;
 }
-.tox[dir=rtl] .accessibility-issue__header > *:nth-last-child(2) {
+.tox[dir=rtl] .tox-dialog__body-content .accessibility-issue__header > *:nth-last-child(2) {
   margin-right: auto;
 }
-.tox[dir=rtl] .accessibility-issue__description {
+.tox[dir=rtl] .tox-dialog__body-content .accessibility-issue__description {
   padding: 4px 8px 4px 4px;
 }
-.tox[dir=rtl] .accessibility-issue__description > *:last-child {
+.tox[dir=rtl] .tox-dialog__body-content .accessibility-issue__description > *:last-child {
   border-right-width: 1px;
   padding-right: 4px;
 }
@@ -222,8 +227,8 @@ button::-moz-focus-inner {
 .tox .tox-button {
   background-color: #7dc67d;
   background-image: none;
-  background-position: none;
-  background-repeat: none;
+  background-position: 0 0;
+  background-repeat: repeat;
   border-color: #7dc67d;
   border-radius: 0.3rem;
   border-style: solid;
@@ -235,15 +240,16 @@ button::-moz-focus-inner {
   display: inline-block;
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   font-size: 1.35rem;
+  font-style: normal;
   font-weight: 400;
-  letter-spacing: 1;
+  letter-spacing: normal;
   line-height: 1.5;
   margin: 0;
   outline: none;
   padding: 0.5rem 1.25rem;
   text-align: center;
   text-decoration: none;
-  text-transform: capitalize;
+  text-transform: none;
   white-space: nowrap;
 }
 .tox .tox-button[disabled] {
@@ -278,18 +284,22 @@ button::-moz-focus-inner {
 .tox .tox-button--secondary {
   background-color: #bbb;
   background-image: none;
-  background-position: none;
-  background-repeat: none;
+  background-position: 0 0;
+  background-repeat: repeat;
   border-color: #bbb;
   border-radius: 0.2rem;
   border-style: solid;
   border-width: 1px;
   box-shadow: none;
   color: white;
+  font-size: 1.35rem;
+  font-style: normal;
+  font-weight: 400;
+  letter-spacing: normal;
   outline: none;
   padding: 0.5rem 1.25rem;
   text-decoration: none;
-  text-transform: capitalize;
+  text-transform: none;
 }
 .tox .tox-button--secondary[disabled] {
   background-color: #bbb;
@@ -394,7 +404,6 @@ button::-moz-focus-inner {
 .tox .tox-checkbox__input {
   /* Hide from view but visible to screen readers */
   height: 1px;
-  left: -10000px;
   overflow: hidden;
   position: absolute;
   top: auto;
@@ -456,12 +465,18 @@ button::-moz-focus-inner {
 .tox:not([dir=rtl]) .tox-checkbox__label {
   margin-left: 4px;
 }
+.tox:not([dir=rtl]) .tox-checkbox__input {
+  left: -10000px;
+}
 .tox:not([dir=rtl]) .tox-bar .tox-checkbox {
   margin-left: 4px;
 }
 .tox[dir=rtl] .tox-checkbox__label {
   margin-right: 4px;
 }
+.tox[dir=rtl] .tox-checkbox__input {
+  right: -10000px;
+}
 .tox[dir=rtl] .tox-bar .tox-checkbox {
   margin-right: 4px;
 }
@@ -532,20 +547,18 @@ button::-moz-focus-inner {
   padding: 4px;
 }
 .tox .tox-collection--list .tox-collection__item--enabled {
-  background-color: inherit;
-  color: contrast(inherit, #222f3e, #fff);
+  background-color: #fff;
+  color: #222f3e;
 }
-.tox .tox-collection--list .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
+.tox .tox-collection--list .tox-collection__item--active {
   background-color: #dee0e2;
-  color: #222f3e;
 }
 .tox .tox-collection--toolbar .tox-collection__item--enabled {
   background-color: #c8cbcf;
   color: #222f3e;
 }
-.tox .tox-collection--toolbar .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
+.tox .tox-collection--toolbar .tox-collection__item--active {
   background-color: #dee0e2;
-  color: #222f3e;
 }
 .tox .tox-collection--grid .tox-collection__item--enabled {
   background-color: #c8cbcf;
@@ -555,19 +568,22 @@ button::-moz-focus-inner {
   background-color: #dee0e2;
   color: #222f3e;
 }
-.tox .tox-collection__item--state-disabled {
-  background-color: transparent;
-  color: rgba(34, 47, 62, 0.5);
-  cursor: default;
+.tox .tox-collection--list .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
+  color: #222f3e;
 }
-.tox .tox-collection__item-icon {
+.tox .tox-collection--toolbar .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
+  color: #222f3e;
+}
+.tox .tox-collection__item-icon,
+.tox .tox-collection__item-checkmark {
   align-items: center;
   display: flex;
   height: 24px;
   justify-content: center;
   width: 24px;
 }
-.tox .tox-collection__item-icon svg {
+.tox .tox-collection__item-icon svg,
+.tox .tox-collection__item-checkmark svg {
   fill: currentColor;
 }
 .tox .tox-collection--toolbar-lg .tox-collection__item-icon {
@@ -592,7 +608,7 @@ button::-moz-focus-inner {
   font-size: 14px;
   height: 24px;
   line-height: 24px;
-  text-transform: normal;
+  text-transform: none;
 }
 .tox .tox-collection__item-caret {
   align-items: center;
@@ -607,7 +623,18 @@ button::-moz-focus-inner {
 .tox .tox-collection__item-caret svg {
   fill: #222f3e;
 }
-.tox .tox-collection__item[role="menuitemcheckbox"]:not(.tox-collection__item--enabled) .tox-collection__item-checkmark svg {
+.tox .tox-collection__item--state-disabled {
+  background-color: transparent;
+  color: rgba(34, 47, 62, 0.5);
+  cursor: not-allowed;
+}
+.tox .tox-collection__item--state-disabled .tox-collection__item-caret svg {
+  fill: rgba(34, 47, 62, 0.5);
+}
+.tox .tox-collection--list .tox-collection__item:not(.tox-collection__item--enabled) .tox-collection__item-checkmark svg {
+  display: none;
+}
+.tox .tox-collection--list .tox-collection__item:not(.tox-collection__item--enabled) .tox-collection__item-accessory + .tox-collection__item-checkmark {
   display: none;
 }
 .tox .tox-collection--horizontal {
@@ -641,13 +668,61 @@ button::-moz-focus-inner {
 .tox .tox-collection--horizontal .tox-collection__item-caret {
   margin-left: 4px;
 }
+.tox .tox-collection__item-container {
+  display: flex;
+}
+.tox .tox-collection__item-container--row {
+  align-items: center;
+  flex: 1 1 auto;
+  flex-direction: row;
+}
+.tox .tox-collection__item-container--row.tox-collection__item-container--align-left {
+  margin-right: auto;
+}
+.tox .tox-collection__item-container--row.tox-collection__item-container--align-right {
+  justify-content: flex-end;
+  margin-left: auto;
+}
+.tox .tox-collection__item-container--row.tox-collection__item-container--valign-top {
+  align-items: flex-start;
+  margin-bottom: auto;
+}
+.tox .tox-collection__item-container--row.tox-collection__item-container--valign-middle {
+  align-items: center;
+}
+.tox .tox-collection__item-container--row.tox-collection__item-container--valign-bottom {
+  align-items: flex-end;
+  margin-top: auto;
+}
+.tox .tox-collection__item-container--column {
+  -ms-grid-row-align: center;
+      align-self: center;
+  flex: 1 1 auto;
+  flex-direction: column;
+}
+.tox .tox-collection__item-container--column.tox-collection__item-container--align-left {
+  align-items: flex-start;
+}
+.tox .tox-collection__item-container--column.tox-collection__item-container--align-right {
+  align-items: flex-end;
+}
+.tox .tox-collection__item-container--column.tox-collection__item-container--valign-top {
+  align-self: flex-start;
+}
+.tox .tox-collection__item-container--column.tox-collection__item-container--valign-middle {
+  -ms-grid-row-align: center;
+      align-self: center;
+}
+.tox .tox-collection__item-container--column.tox-collection__item-container--valign-bottom {
+  align-self: flex-end;
+}
 .tox:not([dir=rtl]) .tox-collection--horizontal .tox-collection__group:not(:last-of-type) {
   border-right: 1px solid #c2c2c2;
 }
 .tox:not([dir=rtl]) .tox-collection--list .tox-collection__item > *:not(:first-child) {
   margin-left: 8px;
 }
-.tox:not([dir=rtl]) .tox-collection--list .tox-collection__item-label:first-child {
+.tox:not([dir=rtl]) .tox-collection--list .tox-collection__item > .tox-collection__item-label:first-child {
   margin-left: 4px;
 }
 .tox:not([dir=rtl]) .tox-collection__item-accessory {
@@ -663,15 +738,9 @@ button::-moz-focus-inner {
 .tox[dir=rtl] .tox-collection--list .tox-collection__item > *:not(:first-child) {
   margin-right: 8px;
 }
-.tox[dir=rtl] .tox-collection--list .tox-collection__item-label:first-child {
+.tox[dir=rtl] .tox-collection--list .tox-collection__item > .tox-collection__item-label:first-child {
   margin-right: 4px;
 }
-.tox[dir=rtl] .tox-collection__item-icon-rtl {
-  /* stylelint-disable-next-line no-descending-specificity */
-}
-.tox[dir=rtl] .tox-collection__item-icon-rtl .tox-collection__item-icon svg {
-  transform: rotateY(180deg);
-}
 .tox[dir=rtl] .tox-collection__item-accessory {
   margin-right: 16px;
   text-align: left;
@@ -1126,7 +1195,7 @@ button::-moz-focus-inner {
   font-weight: 500;
   line-height: 1.5;
   margin: 0;
-  text-transform: normal;
+  text-transform: none;
 }
 .tox .tox-dialog__body {
   color: #222f3e;
@@ -1139,7 +1208,7 @@ button::-moz-focus-inner {
   line-height: 1.5;
   min-width: 0;
   text-align: left;
-  text-transform: normal;
+  text-transform: none;
 }
 @media only screen and (max-width:767px) {
   body:not(.tox-force-desktop) .tox .tox-dialog__body {
@@ -1216,6 +1285,9 @@ button::-moz-focus-inner {
   color: #3e568e;
   text-decoration: none;
 }
+.tox .tox-dialog__body-content svg {
+  fill: #222f3e;
+}
 .tox .tox-dialog__body-content ul {
   display: block;
   list-style-type: disc;
@@ -1228,16 +1300,24 @@ button::-moz-focus-inner {
           padding-inline-start: 2.5rem;
 }
 .tox .tox-dialog__body-content .tox-form__group h1 {
+  color: #222f3e;
   font-size: 20px;
+  font-style: normal;
   font-weight: bold;
+  letter-spacing: normal;
   margin-bottom: 16px;
   margin-top: 2rem;
+  text-transform: none;
 }
 .tox .tox-dialog__body-content .tox-form__group h2 {
+  color: #222f3e;
   font-size: 16px;
+  font-style: normal;
   font-weight: bold;
+  letter-spacing: normal;
   margin-bottom: 16px;
   margin-top: 2rem;
+  text-transform: none;
 }
 .tox .tox-dialog__body-content .tox-form__group p {
   margin-bottom: 16px;
@@ -1348,9 +1428,6 @@ button::-moz-focus-inner {
 .tox .tox-dialog-dock-transition.tox-dialog-dock-fadein {
   transition-delay: 0s;
 }
-body.tox-dialog__disable-scroll {
-  overflow: hidden;
-}
 .tox.tox-platform-ie {
   /* IE11 CSS styles go here */
 }
@@ -1388,6 +1465,9 @@ body.tox-dialog__disable-scroll {
 .tox[dir=rtl] .tox-dialog__footer .tox-dialog__footer-end > * {
   margin-right: 8px;
 }
+body.tox-dialog__disable-scroll {
+  overflow: hidden;
+}
 .tox .tox-dropzone-container {
   display: flex;
   flex: 1;
@@ -1438,6 +1518,18 @@ body.tox-dialog__disable-scroll {
 .tox .tox-editor-header {
   z-index: 1;
 }
+.tox:not(.tox-tinymce-inline) .tox-editor-header {
+  box-shadow: none;
+  transition: box-shadow 0.5s;
+}
+.tox.tox-tinymce--toolbar-bottom .tox-editor-header,
+.tox.tox-tinymce-inline .tox-editor-header {
+  margin-bottom: -1px;
+}
+.tox.tox-tinymce--toolbar-sticky-on .tox-editor-header {
+  background-color: transparent;
+  box-shadow: 0 4px 4px -3px rgba(0, 0, 0, 0.25);
+}
 .tox-editor-dock-fadeout {
   opacity: 0;
   visibility: hidden;
@@ -1505,31 +1597,64 @@ body.tox-dialog__disable-scroll {
 }
 .tox .tox-color-input {
   display: flex;
+  position: relative;
+  z-index: 1;
 }
 .tox .tox-color-input .tox-textfield {
-  border-radius: 3px 0 0 3px;
-  display: flex;
+  z-index: -1;
 }
 .tox .tox-color-input span {
   border-color: rgba(34, 47, 62, 0.2);
-  border-radius: 0 3px 3px 0;
+  border-radius: 0.25rem;
   border-style: solid;
-  border-width: 1px 1px 1px 0;
+  border-width: 1px;
   box-shadow: none;
   box-sizing: border-box;
-  cursor: pointer;
-  display: flex;
-  width: 35px;
+  height: 24px;
+  position: absolute;
+  top: 6px;
+  width: 24px;
 }
-.tox .tox-color-input span:focus {
+.tox .tox-color-input span:hover:not([aria-disabled=true]),
+.tox .tox-color-input span:focus:not([aria-disabled=true]) {
   border-color: #7dc67d;
+  cursor: pointer;
+}
+.tox .tox-color-input span::before {
+  background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%), linear-gradient(-45deg, rgba(0, 0, 0, 0.25) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, rgba(0, 0, 0, 0.25) 75%), linear-gradient(-45deg, transparent 75%, rgba(0, 0, 0, 0.25) 75%);
+  background-position: 0 0, 0 6px, 6px -6px, -6px 0;
+  background-size: 12px 12px;
+  border: 1px solid #fff;
+  border-radius: 0.25rem;
+  box-sizing: border-box;
+  content: '';
+  height: 24px;
+  left: -1px;
+  position: absolute;
+  top: -1px;
+  width: 24px;
+  z-index: -1;
+}
+.tox .tox-color-input span[aria-disabled=true] {
+  cursor: not-allowed;
+}
+.tox:not([dir=rtl]) .tox-color-input {
+  /* stylelint-disable-next-line no-descending-specificity */
+}
+.tox:not([dir=rtl]) .tox-color-input .tox-textfield {
+  padding-left: 36px;
+}
+.tox:not([dir=rtl]) .tox-color-input span {
+  left: 6px;
+}
+.tox[dir="rtl"] .tox-color-input {
+  /* stylelint-disable-next-line no-descending-specificity */
 }
 .tox[dir="rtl"] .tox-color-input .tox-textfield {
-  border-radius: 0 3px 3px 0;
+  padding-right: 36px;
 }
 .tox[dir="rtl"] .tox-color-input span {
-  border-radius: 3px 0 0 3px;
-  border-width: 1px 0 1px 1px;
+  right: 6px;
 }
 .tox .tox-label,
 .tox .tox-toolbar-label {
@@ -1540,7 +1665,7 @@ body.tox-dialog__disable-scroll {
   font-weight: bold;
   line-height: 2;
   padding: 0 8px 0 0;
-  text-transform: normal;
+  text-transform: none;
   white-space: nowrap;
 }
 .tox .tox-toolbar-label {
@@ -1623,7 +1748,7 @@ body.tox-dialog__disable-scroll {
 }
 .tox .tox-textfield,
 .tox .tox-toolbar-textfield,
-.tox .tox-selectfield select,
+.tox .tox-listboxfield .tox-listbox--select,
 .tox .tox-textarea {
   -webkit-appearance: none;
      -moz-appearance: none;
@@ -1640,6 +1765,7 @@ body.tox-dialog__disable-scroll {
   font-size: 1rem;
   line-height: 1.5;
   margin: 0;
+  min-height: 34px;
   outline: none;
   padding: 0.375rem 0.75rem;
   resize: none;
@@ -1652,8 +1778,9 @@ body.tox-dialog__disable-scroll {
   cursor: not-allowed;
 }
 .tox .tox-textfield:focus,
-.tox .tox-selectfield select:focus,
+.tox .tox-listboxfield .tox-listbox--select:focus,
 .tox .tox-textarea:focus {
+  background-color: #fff;
   border-color: #a6b5d8;
   box-shadow: 0 0 0 0.2rem rgba(77, 107, 178, 0.25);
   outline: none;
@@ -1685,10 +1812,65 @@ body.tox-dialog__disable-scroll {
 .tox[dir=rtl] .tox-toolbar-textfield + * {
   margin-right: 4px;
 }
+.tox .tox-listboxfield {
+  cursor: pointer;
+  position: relative;
+}
+.tox .tox-listboxfield .tox-listbox--select[disabled] {
+  background-color: #e8e8e8;
+  color: rgba(34, 47, 62, 0.85);
+  cursor: not-allowed;
+}
+.tox .tox-listbox__select-label {
+  cursor: default;
+  flex: 1;
+  margin: 0 4px;
+}
+.tox .tox-listbox__select-chevron {
+  align-items: center;
+  display: flex;
+  justify-content: center;
+  width: 16px;
+}
+.tox .tox-listbox__select-chevron svg {
+  fill: #222f3e;
+}
+.tox .tox-listboxfield .tox-listbox--select {
+  align-items: center;
+  display: flex;
+}
+.tox:not([dir=rtl]) .tox-listboxfield svg {
+  right: 8px;
+}
+.tox[dir=rtl] .tox-listboxfield svg {
+  left: 8px;
+}
 .tox .tox-selectfield {
   cursor: pointer;
   position: relative;
 }
+.tox .tox-selectfield select {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  background-color: #fff;
+  border-color: #c2c2c2;
+  border-radius: 0.25rem;
+  border-style: solid;
+  border-width: 1px;
+  box-shadow: none;
+  box-sizing: border-box;
+  color: #222f3e;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+  font-size: 1rem;
+  line-height: 1.5;
+  margin: 0;
+  min-height: 34px;
+  outline: none;
+  padding: 0.375rem 0.75rem;
+  resize: none;
+  width: 100%;
+}
 .tox .tox-selectfield select[disabled] {
   background-color: #e8e8e8;
   color: rgba(34, 47, 62, 0.85);
@@ -1697,6 +1879,12 @@ body.tox-dialog__disable-scroll {
 .tox .tox-selectfield select::-ms-expand {
   display: none;
 }
+.tox .tox-selectfield select:focus {
+  background-color: #fff;
+  border-color: #a6b5d8;
+  box-shadow: 0 0 0 0.2rem rgba(77, 107, 178, 0.25);
+  outline: none;
+}
 .tox .tox-selectfield svg {
   pointer-events: none;
   position: absolute;
@@ -1726,26 +1914,35 @@ body.tox-dialog__disable-scroll {
 .tox-fullscreen {
   border: 0;
   height: 100%;
-  left: 0;
   margin: 0;
   overflow: hidden;
   -ms-scroll-chaining: none;
       overscroll-behavior: none;
   padding: 0;
-  position: fixed;
-  top: 0;
   touch-action: pinch-zoom;
   width: 100%;
 }
-.tox-fullscreen .tox.tox-tinymce.tox-fullscreen .tox-statusbar__resize-handle {
+.tox.tox-tinymce.tox-fullscreen .tox-statusbar__resize-handle {
   display: none;
 }
-.tox-fullscreen .tox.tox-tinymce.tox-fullscreen {
+.tox.tox-tinymce.tox-fullscreen,
+.tox-shadowhost.tox-fullscreen {
+  left: 0;
+  position: fixed;
+  top: 0;
   z-index: 1200;
 }
-.tox-fullscreen .tox.tox-tinymce-aux {
+.tox.tox-tinymce.tox-fullscreen {
+  background-color: transparent;
+}
+.tox-fullscreen .tox.tox-tinymce-aux,
+.tox-fullscreen ~ .tox.tox-tinymce-aux {
   z-index: 1201;
 }
+.tox .tox-help__more-link {
+  list-style: none;
+  margin-top: 1em;
+}
 .tox .tox-image-tools {
   width: 100%;
 }
@@ -1841,15 +2038,15 @@ body.tox-dialog__disable-scroll {
 .tox .tox-insert-table-picker {
   display: flex;
   flex-wrap: wrap;
-  width: 169px;
+  width: 170px;
 }
 .tox .tox-insert-table-picker > div {
   border-color: #c2c2c2;
   border-style: solid;
   border-width: 0 1px 1px 0;
-  box-sizing: content-box;
-  height: 16px;
-  width: 16px;
+  box-sizing: border-box;
+  height: 17px;
+  width: 17px;
 }
 .tox .tox-collection--list .tox-collection__group .tox-insert-table-picker {
   margin: -4px 0;
@@ -1921,10 +2118,13 @@ body.tox-dialog__disable-scroll {
   flex-wrap: wrap;
   padding: 0 4px 0 4px;
 }
+.tox.tox-tinymce:not(.tox-tinymce-inline) .tox-editor-header:not(:first-child) .tox-menubar {
+  border-top: 1px solid #c2c2c2;
+}
 /* Deprecated. Remove in next major release */
 .tox .tox-mbtn {
   align-items: center;
-  background: none;
+  background: transparent;
   border: 0;
   border-radius: 3px;
   box-shadow: none;
@@ -1940,11 +2140,11 @@ body.tox-dialog__disable-scroll {
   outline: none;
   overflow: hidden;
   padding: 0 4px;
-  text-transform: normal;
+  text-transform: none;
   width: auto;
 }
 .tox .tox-mbtn[disabled] {
-  background-color: none;
+  background-color: transparent;
   border: 0;
   box-shadow: none;
   color: rgba(34, 47, 62, 0.5);
@@ -2005,6 +2205,7 @@ body.tox-dialog__disable-scroll {
   font-weight: normal;
 }
 .tox .tox-notification a {
+  cursor: pointer;
   text-decoration: underline;
 }
 .tox .tox-notification--in {
@@ -2144,9 +2345,18 @@ body.tox-dialog__disable-scroll {
 .tox .tox-pop--resizing {
   transition: width 0.1s ease;
 }
-.tox .tox-pop--resizing .tox-toolbar {
+.tox .tox-pop--resizing .tox-toolbar,
+.tox .tox-pop--resizing .tox-toolbar__group {
   flex-wrap: nowrap;
 }
+.tox .tox-pop--transition {
+  transition: 0.15s ease;
+  transition-property: left, right, top, bottom;
+}
+.tox .tox-pop--transition::before,
+.tox .tox-pop--transition::after {
+  transition: all 0.15s, visibility 0s, opacity 0.075s ease 0.075s;
+}
 .tox .tox-pop__dialog {
   background-color: #f5f5f5;
   border: 1px solid #c2c2c2;
@@ -2168,9 +2378,15 @@ body.tox-dialog__disable-scroll {
   content: '';
   display: block;
   height: 0;
+  opacity: 1;
   position: absolute;
   width: 0;
 }
+.tox .tox-pop.tox-pop--inset::before,
+.tox .tox-pop.tox-pop--inset::after {
+  opacity: 0;
+  transition: all 0s 0.15s, visibility 0s, opacity 0.075s ease;
+}
 .tox .tox-pop.tox-pop--bottom::before,
 .tox .tox-pop.tox-pop--bottom::after {
   left: 50%;
@@ -2287,7 +2503,10 @@ body.tox-dialog__disable-scroll {
   height: 10px;
   position: absolute;
   width: 10px;
-  z-index: 10000;
+}
+.tox.tox-platform-touch .tox-selector {
+  height: 12px;
+  width: 12px;
 }
 .tox .tox-slider {
   align-items: center;
@@ -2396,12 +2615,12 @@ body.tox-dialog__disable-scroll {
   color: rgba(34, 47, 62, 0.7);
   text-decoration: none;
 }
-.tox .tox-statusbar a:hover,
-.tox .tox-statusbar__path-item:hover,
-.tox .tox-statusbar__wordcount:hover,
-.tox .tox-statusbar a:focus,
-.tox .tox-statusbar__path-item:focus,
-.tox .tox-statusbar__wordcount:focus {
+.tox .tox-statusbar a:hover:not(:disabled):not([aria-disabled=true]),
+.tox .tox-statusbar__path-item:hover:not(:disabled):not([aria-disabled=true]),
+.tox .tox-statusbar__wordcount:hover:not(:disabled):not([aria-disabled=true]),
+.tox .tox-statusbar a:focus:not(:disabled):not([aria-disabled=true]),
+.tox .tox-statusbar__path-item:focus:not(:disabled):not([aria-disabled=true]),
+.tox .tox-statusbar__wordcount:focus:not(:disabled):not([aria-disabled=true]) {
   cursor: pointer;
   text-decoration: underline;
 }
@@ -2420,6 +2639,11 @@ body.tox-dialog__disable-scroll {
   display: block;
   fill: rgba(34, 47, 62, 0.7);
 }
+.tox .tox-statusbar__resize-handle:focus svg {
+  background-color: #dee0e2;
+  border-radius: 1px;
+  box-shadow: 0 0 0 2px #dee0e2;
+}
 .tox:not([dir=rtl]) .tox-statusbar__path > * {
   margin-right: 4px;
 }
@@ -2433,7 +2657,7 @@ body.tox-dialog__disable-scroll {
   margin-left: 4px;
 }
 .tox .tox-throbber {
-  z-index: 1400;
+  z-index: 1299;
 }
 .tox .tox-throbber__busy-spinner {
   align-items: center;
@@ -2448,7 +2672,7 @@ body.tox-dialog__disable-scroll {
 }
 .tox .tox-tbtn {
   align-items: center;
-  background: none;
+  background: transparent;
   border: 0;
   border-radius: 3px;
   box-shadow: none;
@@ -2464,7 +2688,7 @@ body.tox-dialog__disable-scroll {
   outline: none;
   overflow: hidden;
   padding: 0;
-  text-transform: normal;
+  text-transform: none;
   width: 34px;
 }
 .tox .tox-tbtn svg {
@@ -2503,7 +2727,7 @@ body.tox-dialog__disable-scroll {
 .tox .tox-tbtn--disabled:hover,
 .tox .tox-tbtn:disabled,
 .tox .tox-tbtn:disabled:hover {
-  background: none;
+  background: transparent;
   border: 0;
   box-shadow: none;
   color: rgba(34, 47, 62, 0.5);
@@ -2618,9 +2842,6 @@ body.tox-dialog__disable-scroll {
 .tox .tox-split-button__chevron svg {
   fill: rgba(34, 47, 62, 0.5);
 }
-.tox .tox-pop .tox-split-button__chevron svg {
-  transform: rotate(-90deg);
-}
 .tox .tox-split-button .tox-tbtn {
   margin: 0;
 }
@@ -2634,7 +2855,7 @@ body.tox-dialog__disable-scroll {
 .tox .tox-split-button.tox-tbtn--disabled:focus,
 .tox .tox-split-button.tox-tbtn--disabled .tox-tbtn:hover,
 .tox .tox-split-button.tox-tbtn--disabled .tox-tbtn:focus {
-  background: none;
+  background: transparent;
   box-shadow: none;
   color: rgba(34, 47, 62, 0.5);
 }
@@ -2665,6 +2886,11 @@ body.tox-dialog__disable-scroll {
 .tox .tox-toolbar__overflow--shrinking {
   transition: opacity 0.3s ease, height 0.2s linear 0.1s, visibility 0s linear 0.3s;
 }
+.tox .tox-menubar + .tox-toolbar,
+.tox .tox-menubar + .tox-toolbar-overlord .tox-toolbar__primary {
+  border-top: 1px solid #c2c2c2;
+  margin-top: -1px;
+}
 .tox .tox-toolbar--scrolling {
   flex-wrap: nowrap;
   overflow-x: auto;
@@ -2675,15 +2901,16 @@ body.tox-dialog__disable-scroll {
 .tox .tox-toolbar--no-divider {
   background-image: none;
 }
+.tox-tinymce:not(.tox-tinymce-inline) .tox-editor-header:not(:first-child) .tox-toolbar:first-child,
+.tox-tinymce:not(.tox-tinymce-inline) .tox-editor-header:not(:first-child) .tox-toolbar-overlord:first-child .tox-toolbar__primary {
+  border-top: 1px solid #c2c2c2;
+}
 .tox.tox-tinymce-aux .tox-toolbar__overflow {
   background-color: #f5f5f5;
   border: 1px solid #c2c2c2;
   border-radius: 3px;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
 }
-.tox[dir=rtl] .tox-tbtn__icon-rtl svg {
-  transform: rotateY(180deg);
-}
 .tox .tox-toolbar__group {
   align-items: center;
   display: flex;
@@ -2695,6 +2922,7 @@ body.tox-dialog__disable-scroll {
   margin-left: auto;
 }
 .tox .tox-toolbar--scrolling .tox-toolbar__group {
+  flex-shrink: 0;
   flex-wrap: nowrap;
 }
 .tox:not([dir=rtl]) .tox-toolbar__group:not(:last-of-type) {
@@ -2717,7 +2945,7 @@ body.tox-dialog__disable-scroll {
   font-style: normal;
   font-weight: normal;
   padding: 4px 8px;
-  text-transform: normal;
+  text-transform: none;
 }
 .tox .tox-tooltip__arrow {
   position: absolute;
@@ -2777,7 +3005,8 @@ body.tox-dialog__disable-scroll {
   border: 1px solid #c2c2c2;
   border-radius: 3px;
   display: flex;
-  height: 525px;
+  flex: 1;
+  position: relative;
 }
 /* stylelint-disable */
 .tox {
@@ -2905,12 +3134,12 @@ body.tox-dialog__disable-scroll {
 }
 .tox .tox-textfield,
 .tox .tox-toolbar-textfield,
-.tox .tox-selectfield select,
+.tox .tox-listboxfield .tox-listbox--select,
 .tox .tox-textarea {
   transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
 }
 .tox .tox-textfield:focus,
-.tox .tox-selectfield select:focus,
+.tox .tox-listboxfield .tox-listbox--select:focus,
 .tox .tox-textarea:focus {
   border-color: hsl(var(--primary-hue), var(--primary-saturation), calc(var(--primary-lightness) + 25%));
   box-shadow: 0 0 0 0.2rem rgba(var(--primary-rgb), 0.25);