angelovcom.net

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

style-rtl.css (54051B)


      1 /**
      2  * Colors
      3  */
      4 /**
      5  * Breakpoints & Media Queries
      6  */
      7 /**
      8  * SCSS Variables.
      9  *
     10  * Please use variables from this sheet to ensure consistency across the UI.
     11  * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
     12  * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
     13  */
     14 /**
     15  * Colors
     16  */
     17 /**
     18  * Fonts & basic variables.
     19  */
     20 /**
     21  * Grid System.
     22  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
     23  */
     24 /**
     25  * Dimensions.
     26  */
     27 /**
     28  * Shadows.
     29  */
     30 /**
     31  * Editor widths.
     32  */
     33 /**
     34  * Block & Editor UI.
     35  */
     36 /**
     37  * Block paddings.
     38  */
     39 /**
     40  * React Native specific.
     41  * These variables do not appear to be used anywhere else.
     42  */
     43 /**
     44  * Breakpoint mixins
     45  */
     46 /**
     47  * Long content fade mixin
     48  *
     49  * Creates a fading overlay to signify that the content is longer
     50  * than the space allows.
     51  */
     52 /**
     53  * Focus styles.
     54  */
     55 /**
     56  * Applies editor left position to the selector passed as argument
     57  */
     58 /**
     59  * Styles that are reused verbatim in a few places
     60  */
     61 /**
     62  * Allows users to opt-out of animations via OS-level preferences.
     63  */
     64 /**
     65  * Reset default styles for JavaScript UI based pages.
     66  * This is a WP-admin agnostic reset
     67  */
     68 /**
     69  * Reset the WP Admin page styles for Gutenberg-like pages.
     70  */
     71 :root {
     72   --wp-admin-theme-color: #007cba;
     73   --wp-admin-theme-color-darker-10: #006ba1;
     74   --wp-admin-theme-color-darker-20: #005a87;
     75   --wp-admin-border-width-focus: 2px;
     76 }
     77 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
     78   :root {
     79     --wp-admin-border-width-focus: 1.5px;
     80   }
     81 }
     82 
     83 .components-panel__header.interface-complementary-area-header__small {
     84   background: #fff;
     85   padding-left: 4px;
     86 }
     87 .components-panel__header.interface-complementary-area-header__small .interface-complementary-area-header__small-title {
     88   overflow: hidden;
     89   text-overflow: ellipsis;
     90   white-space: nowrap;
     91   width: 100%;
     92 }
     93 @media (min-width: 782px) {
     94   .components-panel__header.interface-complementary-area-header__small {
     95     display: none;
     96   }
     97 }
     98 
     99 .interface-complementary-area-header {
    100   background: #fff;
    101   padding-left: 4px;
    102 }
    103 .interface-complementary-area-header .components-button.has-icon {
    104   display: none;
    105   margin-right: auto;
    106 }
    107 .interface-complementary-area-header .components-button.has-icon ~ .components-button {
    108   margin-right: 0;
    109 }
    110 @media (min-width: 782px) {
    111   .interface-complementary-area-header .components-button.has-icon {
    112     display: flex;
    113   }
    114 }
    115 
    116 .interface-complementary-area {
    117   background: #fff;
    118   color: #1e1e1e;
    119 }
    120 @media (min-width: 600px) {
    121   .interface-complementary-area {
    122     -webkit-overflow-scrolling: touch;
    123   }
    124 }
    125 @media (min-width: 782px) {
    126   .interface-complementary-area {
    127     width: 280px;
    128   }
    129 }
    130 .interface-complementary-area .components-panel {
    131   border: none;
    132   position: relative;
    133   z-index: 0;
    134 }
    135 .interface-complementary-area .components-panel__header {
    136   position: sticky;
    137   top: 0;
    138   z-index: 1;
    139 }
    140 .interface-complementary-area .components-panel__header.edit-post-sidebar__panel-tabs {
    141   top: 48px;
    142 }
    143 @media (min-width: 782px) {
    144   .interface-complementary-area .components-panel__header.edit-post-sidebar__panel-tabs {
    145     top: 0;
    146   }
    147 }
    148 .interface-complementary-area p {
    149   margin-top: 0;
    150 }
    151 .interface-complementary-area h2,
    152 .interface-complementary-area h3 {
    153   font-size: 13px;
    154   color: #1e1e1e;
    155   margin-bottom: 1.5em;
    156 }
    157 .interface-complementary-area hr {
    158   border-top: none;
    159   border-bottom: 1px solid #f0f0f0;
    160   margin: 1.5em 0;
    161 }
    162 .interface-complementary-area div.components-toolbar-group,
    163 .interface-complementary-area div.components-toolbar {
    164   box-shadow: none;
    165   margin-bottom: 1.5em;
    166 }
    167 .interface-complementary-area div.components-toolbar-group:last-child,
    168 .interface-complementary-area div.components-toolbar:last-child {
    169   margin-bottom: 0;
    170 }
    171 .interface-complementary-area .block-editor-skip-to-selected-block:focus {
    172   top: auto;
    173   left: 10px;
    174   bottom: 10px;
    175   right: auto;
    176 }
    177 
    178 @media (min-width: 782px) {
    179   body.js.is-fullscreen-mode {
    180     margin-top: -32px;
    181     height: calc(100% + 32px);
    182   }
    183   body.js.is-fullscreen-mode #adminmenumain,
    184 body.js.is-fullscreen-mode #wpadminbar {
    185     display: none;
    186   }
    187   body.js.is-fullscreen-mode #wpcontent,
    188 body.js.is-fullscreen-mode #wpfooter {
    189     margin-right: 0;
    190   }
    191 }
    192 
    193 html.interface-interface-skeleton__html-container {
    194   position: fixed;
    195   width: 100%;
    196 }
    197 @media (min-width: 782px) {
    198   html.interface-interface-skeleton__html-container {
    199     position: initial;
    200     width: initial;
    201   }
    202 }
    203 
    204 .interface-interface-skeleton {
    205   display: flex;
    206   flex-direction: row;
    207   height: auto;
    208   max-height: 100%;
    209   position: fixed;
    210   top: 46px;
    211   right: 0;
    212   left: 0;
    213   bottom: 0;
    214 }
    215 @media (min-width: 783px) {
    216   .interface-interface-skeleton {
    217     top: 32px;
    218   }
    219   .is-fullscreen-mode .interface-interface-skeleton {
    220     top: 0;
    221   }
    222 }
    223 
    224 .interface-interface-skeleton__editor {
    225   display: flex;
    226   flex-direction: column;
    227   flex: 0 1 100%;
    228   overflow: hidden;
    229 }
    230 
    231 .interface-interface-skeleton {
    232   /* Set left position when auto-fold is not on the body element. */
    233   right: 0;
    234 }
    235 @media (min-width: 783px) {
    236   .interface-interface-skeleton {
    237     right: 160px;
    238   }
    239 }
    240 
    241 .auto-fold .interface-interface-skeleton {
    242   /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */
    243 }
    244 @media (min-width: 783px) {
    245   .auto-fold .interface-interface-skeleton {
    246     right: 36px;
    247   }
    248 }
    249 @media (min-width: 961px) {
    250   .auto-fold .interface-interface-skeleton {
    251     right: 160px;
    252   }
    253 }
    254 
    255 /* Sidebar manually collapsed. */
    256 .folded .interface-interface-skeleton {
    257   right: 0;
    258 }
    259 @media (min-width: 783px) {
    260   .folded .interface-interface-skeleton {
    261     right: 36px;
    262   }
    263 }
    264 
    265 body.is-fullscreen-mode .interface-interface-skeleton {
    266   right: 0 !important;
    267 }
    268 
    269 .interface-interface-skeleton__body {
    270   flex-grow: 1;
    271   display: flex;
    272   overflow: auto;
    273   overscroll-behavior-y: none;
    274 }
    275 @media (min-width: 782px) {
    276   .has-footer .interface-interface-skeleton__body {
    277     padding-bottom: 25px;
    278   }
    279 }
    280 
    281 .interface-interface-skeleton__content {
    282   flex-grow: 1;
    283   display: flex;
    284   flex-direction: column;
    285   overflow: auto;
    286   z-index: 20;
    287 }
    288 
    289 .interface-interface-skeleton__secondary-sidebar,
    290 .interface-interface-skeleton__sidebar {
    291   display: block;
    292   flex-shrink: 0;
    293   position: absolute;
    294   z-index: 100000;
    295   top: 0;
    296   left: 0;
    297   bottom: 0;
    298   right: 0;
    299   background: #fff;
    300   color: #1e1e1e;
    301 }
    302 @media (min-width: 782px) {
    303   .interface-interface-skeleton__secondary-sidebar,
    304 .interface-interface-skeleton__sidebar {
    305     position: relative !important;
    306     z-index: 90;
    307     width: auto;
    308   }
    309 }
    310 
    311 .interface-interface-skeleton__sidebar {
    312   overflow: auto;
    313 }
    314 @media (min-width: 782px) {
    315   .interface-interface-skeleton__sidebar {
    316     border-right: 1px solid #e0e0e0;
    317   }
    318 }
    319 
    320 @media (min-width: 782px) {
    321   .interface-interface-skeleton__secondary-sidebar {
    322     border-left: 1px solid #e0e0e0;
    323   }
    324 }
    325 
    326 .interface-interface-skeleton__header {
    327   flex-shrink: 0;
    328   height: auto;
    329   border-bottom: 1px solid #e0e0e0;
    330   z-index: 30;
    331   color: #1e1e1e;
    332 }
    333 
    334 .interface-interface-skeleton__footer {
    335   height: auto;
    336   flex-shrink: 0;
    337   border-top: 1px solid #e0e0e0;
    338   color: #1e1e1e;
    339   position: absolute;
    340   bottom: 0;
    341   right: 0;
    342   width: 100%;
    343   background-color: #fff;
    344   z-index: 90;
    345   display: none;
    346 }
    347 @media (min-width: 782px) {
    348   .interface-interface-skeleton__footer {
    349     display: flex;
    350   }
    351 }
    352 .interface-interface-skeleton__footer .block-editor-block-breadcrumb {
    353   z-index: 30;
    354   display: flex;
    355   background: #fff;
    356   height: 24px;
    357   align-items: center;
    358   font-size: 13px;
    359   padding: 0 18px;
    360 }
    361 
    362 .interface-interface-skeleton__actions {
    363   z-index: 100000;
    364   position: fixed !important;
    365   top: -9999em;
    366   bottom: auto;
    367   right: auto;
    368   left: 0;
    369   width: 280px;
    370   color: #1e1e1e;
    371 }
    372 .interface-interface-skeleton__actions:focus {
    373   top: auto;
    374   bottom: 0;
    375 }
    376 
    377 .interface-pinned-items {
    378   display: flex;
    379 }
    380 .interface-pinned-items .components-button:not(:first-child) {
    381   display: none;
    382 }
    383 @media (min-width: 600px) {
    384   .interface-pinned-items .components-button:not(:first-child) {
    385     display: flex;
    386   }
    387 }
    388 .interface-pinned-items .components-button {
    389   margin-right: 4px;
    390 }
    391 .interface-pinned-items .components-button svg {
    392   max-width: 24px;
    393   max-height: 24px;
    394 }
    395 
    396 .edit-post-header {
    397   height: 60px;
    398   background: #fff;
    399   display: flex;
    400   flex-wrap: wrap;
    401   align-items: center;
    402   max-width: 100vw;
    403 }
    404 @media (min-width: 280px) {
    405   .edit-post-header {
    406     flex-wrap: nowrap;
    407   }
    408 }
    409 .edit-post-header > .edit-post-header__settings {
    410   order: 1;
    411 }
    412 @supports (position: sticky) {
    413   .edit-post-header > .edit-post-header__settings {
    414     order: initial;
    415   }
    416 }
    417 
    418 .edit-post-header__toolbar {
    419   display: flex;
    420   flex-grow: 1;
    421 }
    422 .edit-post-header__toolbar .table-of-contents {
    423   display: none;
    424 }
    425 @media (min-width: 600px) {
    426   .edit-post-header__toolbar .table-of-contents {
    427     display: block;
    428   }
    429 }
    430 
    431 .edit-post-header__settings {
    432   display: inline-flex;
    433   align-items: center;
    434   flex-wrap: wrap;
    435   padding-left: 4px;
    436   /**
    437    * Buttons in the Toolbar
    438   	 */
    439 }
    440 @media (min-width: 600px) {
    441   .edit-post-header__settings {
    442     padding-left: 16px;
    443   }
    444 }
    445 .edit-post-header__settings .editor-post-saved-state,
    446 .edit-post-header__settings .components-button.components-button {
    447   margin-left: 4px;
    448 }
    449 @media (min-width: 600px) {
    450   .edit-post-header__settings .editor-post-saved-state,
    451 .edit-post-header__settings .components-button.components-button {
    452     margin-left: 12px;
    453   }
    454 }
    455 .edit-post-header__settings .editor-post-saved-state,
    456 .edit-post-header__settings .components-button.is-tertiary {
    457   padding: 0 6px;
    458 }
    459 .edit-post-header__settings .edit-post-more-menu .components-button,
    460 .edit-post-header__settings .interface-pinned-items .components-button {
    461   margin-left: 0;
    462 }
    463 
    464 .edit-post-header-preview__grouping-external {
    465   display: flex;
    466   position: relative;
    467   padding-bottom: 0;
    468 }
    469 
    470 .edit-post-header-preview__button-external {
    471   padding-right: 8px;
    472   margin-left: auto;
    473   width: 100%;
    474   display: flex;
    475   justify-content: flex-start;
    476 }
    477 .edit-post-header-preview__button-external svg {
    478   margin-right: auto;
    479 }
    480 
    481 .edit-post-post-preview-dropdown .components-popover__content > div {
    482   padding-bottom: 0;
    483 }
    484 
    485 .show-icon-labels.interface-pinned-items .components-button.has-icon,
    486 .show-icon-labels .edit-post-header .components-button.has-icon,
    487 .edit-post-header__dropdown .components-button.has-icon {
    488   width: auto;
    489 }
    490 .show-icon-labels.interface-pinned-items .components-button.has-icon svg,
    491 .show-icon-labels .edit-post-header .components-button.has-icon svg,
    492 .edit-post-header__dropdown .components-button.has-icon svg {
    493   display: none;
    494 }
    495 .show-icon-labels.interface-pinned-items .components-button.has-icon::after,
    496 .show-icon-labels .edit-post-header .components-button.has-icon::after,
    497 .edit-post-header__dropdown .components-button.has-icon::after {
    498   content: attr(aria-label);
    499 }
    500 .show-icon-labels.interface-pinned-items .components-button.has-icon[aria-disabled=true],
    501 .show-icon-labels .edit-post-header .components-button.has-icon[aria-disabled=true],
    502 .edit-post-header__dropdown .components-button.has-icon[aria-disabled=true] {
    503   background-color: transparent;
    504 }
    505 .show-icon-labels.interface-pinned-items .is-tertiary:active,
    506 .show-icon-labels .edit-post-header .is-tertiary:active,
    507 .edit-post-header__dropdown .is-tertiary:active {
    508   box-shadow: 0 0 0 1.5px var(--wp-admin-theme-color);
    509   background-color: transparent;
    510 }
    511 .show-icon-labels.interface-pinned-items .edit-post-fullscreen-mode-close.has-icon svg,
    512 .show-icon-labels.interface-pinned-items .components-button.has-icon.button-toggle svg,
    513 .show-icon-labels .edit-post-header .edit-post-fullscreen-mode-close.has-icon svg,
    514 .show-icon-labels .edit-post-header .components-button.has-icon.button-toggle svg,
    515 .edit-post-header__dropdown .edit-post-fullscreen-mode-close.has-icon svg,
    516 .edit-post-header__dropdown .components-button.has-icon.button-toggle svg {
    517   display: block;
    518 }
    519 .show-icon-labels.interface-pinned-items .edit-post-fullscreen-mode-close.has-icon::after,
    520 .show-icon-labels.interface-pinned-items .components-button.has-icon.button-toggle::after,
    521 .show-icon-labels .edit-post-header .edit-post-fullscreen-mode-close.has-icon::after,
    522 .show-icon-labels .edit-post-header .components-button.has-icon.button-toggle::after,
    523 .edit-post-header__dropdown .edit-post-fullscreen-mode-close.has-icon::after,
    524 .edit-post-header__dropdown .components-button.has-icon.button-toggle::after {
    525   content: none;
    526 }
    527 .show-icon-labels.interface-pinned-items .edit-post-fullscreen-mode-close.has-icon,
    528 .show-icon-labels .edit-post-header .edit-post-fullscreen-mode-close.has-icon,
    529 .edit-post-header__dropdown .edit-post-fullscreen-mode-close.has-icon {
    530   width: 60px;
    531 }
    532 .show-icon-labels.interface-pinned-items .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon,
    533 .show-icon-labels .edit-post-header .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon,
    534 .edit-post-header__dropdown .components-menu-items-choice .components-menu-items__item-icon.components-menu-items__item-icon {
    535   display: block;
    536 }
    537 .show-icon-labels.interface-pinned-items .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,
    538 .show-icon-labels.interface-pinned-items .interface-pinned-items .components-button,
    539 .show-icon-labels .edit-post-header .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,
    540 .show-icon-labels .edit-post-header .interface-pinned-items .components-button,
    541 .edit-post-header__dropdown .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,
    542 .edit-post-header__dropdown .interface-pinned-items .components-button {
    543   padding-right: 8px;
    544   padding-left: 8px;
    545 }
    546 @media (min-width: 600px) {
    547   .show-icon-labels.interface-pinned-items .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,
    548 .show-icon-labels.interface-pinned-items .interface-pinned-items .components-button,
    549 .show-icon-labels .edit-post-header .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,
    550 .show-icon-labels .edit-post-header .interface-pinned-items .components-button,
    551 .edit-post-header__dropdown .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle,
    552 .edit-post-header__dropdown .interface-pinned-items .components-button {
    553     padding-right: 12px;
    554     padding-left: 12px;
    555   }
    556 }
    557 .show-icon-labels.interface-pinned-items .components-dropdown-menu__toggle,
    558 .show-icon-labels .edit-post-header .components-dropdown-menu__toggle,
    559 .edit-post-header__dropdown .components-dropdown-menu__toggle {
    560   margin-right: 8px;
    561   padding-right: 8px;
    562   padding-left: 8px;
    563 }
    564 @media (min-width: 600px) {
    565   .show-icon-labels.interface-pinned-items .components-dropdown-menu__toggle,
    566 .show-icon-labels .edit-post-header .components-dropdown-menu__toggle,
    567 .edit-post-header__dropdown .components-dropdown-menu__toggle {
    568     margin-right: 12px;
    569     padding-right: 12px;
    570     padding-left: 12px;
    571   }
    572 }
    573 .show-icon-labels.interface-pinned-items .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle::after,
    574 .show-icon-labels .edit-post-header .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle::after,
    575 .edit-post-header__dropdown .edit-post-header-toolbar__inserter-toggle.edit-post-header-toolbar__inserter-toggle::after {
    576   content: none;
    577 }
    578 .show-icon-labels.interface-pinned-items .editor-post-save-draft.editor-post-save-draft::after,
    579 .show-icon-labels .edit-post-header .editor-post-save-draft.editor-post-save-draft::after,
    580 .edit-post-header__dropdown .editor-post-save-draft.editor-post-save-draft::after {
    581   content: none;
    582 }
    583 @media (min-width: 600px) {
    584   .show-icon-labels.interface-pinned-items .editor-post-save-draft.editor-post-save-draft::after,
    585 .show-icon-labels .edit-post-header .editor-post-save-draft.editor-post-save-draft::after,
    586 .edit-post-header__dropdown .editor-post-save-draft.editor-post-save-draft::after {
    587     content: attr(aria-label);
    588   }
    589 }
    590 
    591 .edit-post-header__dropdown .components-menu-item__button.components-menu-item__button,
    592 .edit-post-header__dropdown .components-button.editor-history__undo,
    593 .edit-post-header__dropdown .components-button.editor-history__redo,
    594 .edit-post-header__dropdown .table-of-contents .components-button,
    595 .edit-post-header__dropdown .components-button.block-editor-block-navigation {
    596   margin: 0;
    597   padding: 6px 40px 6px 6px;
    598   width: 14.625rem;
    599   text-align: right;
    600   justify-content: flex-start;
    601 }
    602 
    603 .show-icon-labels.interface-pinned-items {
    604   padding: 6px 12px 12px;
    605   margin-top: 0;
    606   margin-bottom: 0;
    607   margin-right: -12px;
    608   margin-left: -12px;
    609   border-bottom: 1px solid #ccc;
    610   display: block;
    611 }
    612 .show-icon-labels.interface-pinned-items > .components-button.has-icon {
    613   margin: 0;
    614   padding: 6px 8px 6px 6px;
    615   width: 14.625rem;
    616   justify-content: flex-start;
    617 }
    618 .show-icon-labels.interface-pinned-items > .components-button.has-icon[aria-expanded=true] svg {
    619   display: block;
    620   max-width: 24px;
    621 }
    622 .show-icon-labels.interface-pinned-items > .components-button.has-icon[aria-expanded=false] {
    623   padding-right: 40px;
    624 }
    625 .show-icon-labels.interface-pinned-items > .components-button.has-icon svg {
    626   margin-left: 8px;
    627 }
    628 
    629 .edit-post-fullscreen-mode-close.has-icon {
    630   display: none;
    631 }
    632 @media (min-width: 782px) {
    633   .edit-post-fullscreen-mode-close.has-icon {
    634     display: flex;
    635     align-items: center;
    636     align-self: stretch;
    637     border: none;
    638     background: #23282e;
    639     color: #fff;
    640     border-radius: 0;
    641     height: 61px;
    642     width: 60px;
    643     position: relative;
    644     margin-bottom: -1px;
    645   }
    646   .edit-post-fullscreen-mode-close.has-icon:active {
    647     color: #fff;
    648   }
    649   .edit-post-fullscreen-mode-close.has-icon:focus {
    650     box-shadow: none;
    651   }
    652   .edit-post-fullscreen-mode-close.has-icon::before {
    653     transition: box-shadow 0.1s ease;
    654     content: "";
    655     display: block;
    656     position: absolute;
    657     top: 9px;
    658     left: 9px;
    659     bottom: 9px;
    660     right: 9px;
    661     border-radius: 4px;
    662     box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #23282e;
    663   }
    664 }
    665 @media (min-width: 782px) and (prefers-reduced-motion: reduce) {
    666   .edit-post-fullscreen-mode-close.has-icon::before {
    667     transition-duration: 0s;
    668     transition-delay: 0s;
    669   }
    670 }
    671 @media (min-width: 782px) {
    672   .edit-post-fullscreen-mode-close.has-icon:hover::before {
    673     box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #757575;
    674   }
    675 }
    676 @media (min-width: 782px) {
    677   .edit-post-fullscreen-mode-close.has-icon:focus::before {
    678     box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) rgba(255, 255, 255, 0.1), inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
    679   }
    680 }
    681 
    682 .edit-post-fullscreen-mode-close_site-icon {
    683   width: 36px;
    684   border-radius: 2px;
    685 }
    686 
    687 .edit-post-header-toolbar {
    688   display: inline-flex;
    689   flex-grow: 1;
    690   align-items: center;
    691   border: none;
    692 }
    693 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-button {
    694   display: none;
    695 }
    696 @media (min-width: 600px) {
    697   .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-button {
    698     display: inline-flex;
    699   }
    700 }
    701 .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle {
    702   display: inline-flex;
    703 }
    704 .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle svg {
    705   transition: transform cubic-bezier(0.165, 0.84, 0.44, 1) 0.2s;
    706 }
    707 @media (prefers-reduced-motion: reduce) {
    708   .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle svg {
    709     transition-duration: 0s;
    710     transition-delay: 0s;
    711   }
    712 }
    713 .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle.is-pressed svg {
    714   transform: rotate(-45deg);
    715 }
    716 .edit-post-header-toolbar .block-editor-block-navigation {
    717   display: none;
    718 }
    719 @media (min-width: 600px) {
    720   .edit-post-header-toolbar .block-editor-block-navigation {
    721     display: flex;
    722   }
    723 }
    724 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-button.has-icon,
    725 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-dropdown > .components-button.has-icon {
    726   height: 36px;
    727   min-width: 36px;
    728   padding: 6px;
    729 }
    730 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-button.has-icon.is-pressed,
    731 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-dropdown > .components-button.has-icon.is-pressed {
    732   background: #1e1e1e;
    733 }
    734 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-button.has-icon:focus:not(:disabled),
    735 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-dropdown > .components-button.has-icon:focus:not(:disabled) {
    736   box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 1px #fff;
    737   outline: 1px solid transparent;
    738 }
    739 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-button.has-icon::before,
    740 .edit-post-header-toolbar .edit-post-header-toolbar__left > .components-dropdown > .components-button.has-icon::before {
    741   display: none;
    742 }
    743 
    744 @media (min-width: 600px) {
    745   .edit-post-header.has-reduced-ui .edit-post-header-toolbar__left > * + .components-button,
    746 .edit-post-header.has-reduced-ui .edit-post-header-toolbar__left > * + .components-dropdown > [aria-expanded=false] {
    747     transition: opacity 0.1s linear;
    748   }
    749 }
    750 @media (min-width: 600px) and (prefers-reduced-motion: reduce) {
    751   .edit-post-header.has-reduced-ui .edit-post-header-toolbar__left > * + .components-button,
    752 .edit-post-header.has-reduced-ui .edit-post-header-toolbar__left > * + .components-dropdown > [aria-expanded=false] {
    753     transition-duration: 0s;
    754     transition-delay: 0s;
    755   }
    756 }
    757 @media (min-width: 600px) {
    758   .edit-post-header.has-reduced-ui:not(:hover) .edit-post-header-toolbar__left > * + .components-button, .edit-post-header.has-reduced-ui:not(:hover) .edit-post-header-toolbar__left > * + .components-dropdown > [aria-expanded=false] {
    759     opacity: 0;
    760   }
    761 }
    762 
    763 .edit-post-header-toolbar__left {
    764   display: inline-flex;
    765   align-items: center;
    766   padding-right: 8px;
    767 }
    768 @media (min-width: 600px) {
    769   .edit-post-header-toolbar__left {
    770     padding-right: 24px;
    771   }
    772 }
    773 @media (min-width: 1280px) {
    774   .edit-post-header-toolbar__left {
    775     padding-left: 8px;
    776   }
    777 }
    778 
    779 .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle.has-icon {
    780   margin-left: 8px;
    781   min-width: 32px;
    782   width: 32px;
    783   height: 32px;
    784   padding: 0;
    785 }
    786 .show-icon-labels .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle.has-icon {
    787   height: 36px;
    788 }
    789 
    790 .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle.has-text.has-icon {
    791   width: auto;
    792   padding: 0 8px;
    793 }
    794 
    795 .show-icon-labels .edit-post-header-toolbar__left > * + * {
    796   margin-right: 8px;
    797 }
    798 
    799 .edit-post-more-menu {
    800   margin-right: -4px;
    801 }
    802 .edit-post-more-menu .components-button {
    803   width: auto;
    804   padding: 0 2px;
    805 }
    806 @media (min-width: 600px) {
    807   .edit-post-more-menu {
    808     margin-right: 0;
    809   }
    810   .edit-post-more-menu .components-button {
    811     padding: 0 4px;
    812   }
    813 }
    814 
    815 .edit-post-more-menu__content .components-popover__content {
    816   min-width: 280px;
    817 }
    818 @media (min-width: 480px) {
    819   .edit-post-more-menu__content .components-popover__content {
    820     width: auto;
    821     max-width: 480px;
    822   }
    823 }
    824 .edit-post-more-menu__content .components-popover__content .components-dropdown-menu__menu {
    825   padding: 0;
    826 }
    827 
    828 .components-popover.edit-post-more-menu__content {
    829   z-index: 99998;
    830 }
    831 
    832 .edit-post-template-top-area {
    833   display: flex;
    834   flex-direction: column;
    835   align-content: space-between;
    836   width: 100%;
    837   align-items: center;
    838 }
    839 .edit-post-template-top-area .edit-post-template-title,
    840 .edit-post-template-top-area .edit-post-template-post-title {
    841   padding: 0;
    842   text-decoration: none;
    843   height: auto;
    844 }
    845 .edit-post-template-top-area .edit-post-template-title::before,
    846 .edit-post-template-top-area .edit-post-template-post-title::before {
    847   height: 100%;
    848 }
    849 .edit-post-template-top-area .edit-post-template-title.has-icon svg,
    850 .edit-post-template-top-area .edit-post-template-post-title.has-icon svg {
    851   order: 1;
    852   margin-left: 0;
    853 }
    854 .edit-post-template-top-area .edit-post-template-title {
    855   color: #1e1e1e;
    856 }
    857 .edit-post-template-top-area .edit-post-template-post-title {
    858   margin-top: 4px;
    859   max-width: 160px;
    860   white-space: nowrap;
    861   overflow: hidden;
    862   text-overflow: ellipsis;
    863   display: block;
    864 }
    865 .edit-post-template-top-area .edit-post-template-post-title::before {
    866   right: 0;
    867   left: 0;
    868 }
    869 @media (min-width: 1080px) {
    870   .edit-post-template-top-area .edit-post-template-post-title {
    871     max-width: none;
    872   }
    873 }
    874 
    875 .edit-post-template-top-area__popover .components-popover__content {
    876   min-width: 280px;
    877 }
    878 
    879 .edit-post-template-top-area__second-menu-group {
    880   margin-right: -12px;
    881   margin-left: -12px;
    882   padding: 12px;
    883   padding-bottom: 0;
    884   border-top: 1px solid #ddd;
    885 }
    886 .edit-post-template-top-area__second-menu-group .edit-post-template-top-area__delete-template-button {
    887   display: flex;
    888   justify-content: center;
    889 }
    890 .edit-post-template-top-area__second-menu-group .edit-post-template-top-area__delete-template-button .components-menu-item__item {
    891   margin-left: 0;
    892 }
    893 
    894 .edit-post-keyboard-shortcut-help-modal__section {
    895   margin: 0 0 2rem 0;
    896 }
    897 .edit-post-keyboard-shortcut-help-modal__main-shortcuts .edit-post-keyboard-shortcut-help-modal__shortcut-list {
    898   margin-top: -25px;
    899 }
    900 .edit-post-keyboard-shortcut-help-modal__section-title {
    901   font-size: 0.9rem;
    902   font-weight: 600;
    903 }
    904 .edit-post-keyboard-shortcut-help-modal__shortcut {
    905   display: flex;
    906   align-items: baseline;
    907   padding: 0.6rem 0;
    908   border-top: 1px solid #ddd;
    909   margin-bottom: 0;
    910 }
    911 .edit-post-keyboard-shortcut-help-modal__shortcut:last-child {
    912   border-bottom: 1px solid #ddd;
    913 }
    914 .edit-post-keyboard-shortcut-help-modal__shortcut:empty {
    915   display: none;
    916 }
    917 .edit-post-keyboard-shortcut-help-modal__shortcut-term {
    918   font-weight: 600;
    919   margin: 0 1rem 0 0;
    920   text-align: left;
    921 }
    922 .edit-post-keyboard-shortcut-help-modal__shortcut-description {
    923   flex: 1;
    924   margin: 0;
    925   flex-basis: auto;
    926 }
    927 .edit-post-keyboard-shortcut-help-modal__shortcut-key-combination {
    928   display: block;
    929   background: none;
    930   margin: 0;
    931   padding: 0;
    932 }
    933 .edit-post-keyboard-shortcut-help-modal__shortcut-key-combination + .edit-post-keyboard-shortcut-help-modal__shortcut-key-combination {
    934   margin-top: 10px;
    935 }
    936 .edit-post-keyboard-shortcut-help-modal__shortcut-key {
    937   padding: 0.25rem 0.5rem;
    938   border-radius: 8%;
    939   margin: 0 0.2rem 0 0.2rem;
    940 }
    941 .edit-post-keyboard-shortcut-help-modal__shortcut-key:last-child {
    942   margin: 0 0.2rem 0 0;
    943 }
    944 
    945 .edit-post-layout__metaboxes {
    946   flex-shrink: 0;
    947 }
    948 
    949 .edit-post-layout__metaboxes:not(:empty) {
    950   border-top: 1px solid #ddd;
    951   padding: 10px 0 10px;
    952   clear: both;
    953 }
    954 .edit-post-layout__metaboxes:not(:empty) .edit-post-meta-boxes-area {
    955   margin: auto 20px;
    956 }
    957 
    958 .edit-post-layout .components-editor-notices__snackbar {
    959   position: fixed;
    960   left: 0;
    961   bottom: 40px;
    962   padding-right: 16px;
    963   padding-left: 16px;
    964 }
    965 
    966 .edit-post-layout .components-editor-notices__snackbar {
    967   /* Set left position when auto-fold is not on the body element. */
    968   right: 0;
    969 }
    970 @media (min-width: 783px) {
    971   .edit-post-layout .components-editor-notices__snackbar {
    972     right: 160px;
    973   }
    974 }
    975 
    976 .auto-fold .edit-post-layout .components-editor-notices__snackbar {
    977   /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */
    978 }
    979 @media (min-width: 783px) {
    980   .auto-fold .edit-post-layout .components-editor-notices__snackbar {
    981     right: 36px;
    982   }
    983 }
    984 @media (min-width: 961px) {
    985   .auto-fold .edit-post-layout .components-editor-notices__snackbar {
    986     right: 160px;
    987   }
    988 }
    989 
    990 /* Sidebar manually collapsed. */
    991 .folded .edit-post-layout .components-editor-notices__snackbar {
    992   right: 0;
    993 }
    994 @media (min-width: 783px) {
    995   .folded .edit-post-layout .components-editor-notices__snackbar {
    996     right: 36px;
    997   }
    998 }
    999 
   1000 body.is-fullscreen-mode .edit-post-layout .components-editor-notices__snackbar {
   1001   right: 0 !important;
   1002 }
   1003 
   1004 .edit-post-layout .editor-post-publish-panel {
   1005   position: fixed;
   1006   z-index: 100001;
   1007   top: 46px;
   1008   bottom: 0;
   1009   left: 0;
   1010   right: 0;
   1011   overflow: auto;
   1012 }
   1013 @media (min-width: 782px) {
   1014   .edit-post-layout .editor-post-publish-panel {
   1015     z-index: 99998;
   1016     top: 32px;
   1017     right: auto;
   1018     width: 281px;
   1019     border-right: 1px solid #ddd;
   1020     transform: translateX(-100%);
   1021     animation: edit-post-post-publish-panel__slide-in-animation 0.1s forwards;
   1022   }
   1023 }
   1024 @media (min-width: 782px) and (prefers-reduced-motion: reduce) {
   1025   .edit-post-layout .editor-post-publish-panel {
   1026     animation-duration: 1ms;
   1027     animation-delay: 0s;
   1028   }
   1029 }
   1030 @media (min-width: 782px) {
   1031   body.is-fullscreen-mode .edit-post-layout .editor-post-publish-panel {
   1032     top: 0;
   1033   }
   1034 }
   1035 @media (min-width: 782px) {
   1036   [role=region]:focus .edit-post-layout .editor-post-publish-panel {
   1037     transform: translateX(0%);
   1038   }
   1039 }
   1040 
   1041 @keyframes edit-post-post-publish-panel__slide-in-animation {
   1042   100% {
   1043     transform: translateX(0%);
   1044   }
   1045 }
   1046 .edit-post-layout .editor-post-publish-panel__header-publish-button {
   1047   justify-content: center;
   1048 }
   1049 
   1050 .edit-post-layout__toggle-publish-panel,
   1051 .edit-post-layout__toggle-sidebar-panel,
   1052 .edit-post-layout__toggle-entities-saved-states-panel {
   1053   z-index: 100000;
   1054   position: fixed !important;
   1055   top: -9999em;
   1056   bottom: auto;
   1057   right: auto;
   1058   left: 0;
   1059   width: 280px;
   1060   background-color: #fff;
   1061   border: 1px dotted #ddd;
   1062   height: auto !important;
   1063   padding: 24px;
   1064   display: flex;
   1065   justify-content: center;
   1066 }
   1067 .interface-interface-skeleton__actions:focus .edit-post-layout__toggle-publish-panel, .interface-interface-skeleton__actions:focus-within .edit-post-layout__toggle-publish-panel,
   1068 .interface-interface-skeleton__actions:focus .edit-post-layout__toggle-sidebar-panel,
   1069 .interface-interface-skeleton__actions:focus-within .edit-post-layout__toggle-sidebar-panel,
   1070 .interface-interface-skeleton__actions:focus .edit-post-layout__toggle-entities-saved-states-panel,
   1071 .interface-interface-skeleton__actions:focus-within .edit-post-layout__toggle-entities-saved-states-panel {
   1072   top: auto;
   1073   bottom: 0;
   1074 }
   1075 
   1076 @media (min-width: 600px) {
   1077   .edit-post-manage-blocks-modal {
   1078     height: calc(100% - 60px - 60px);
   1079   }
   1080 }
   1081 
   1082 .edit-post-manage-blocks-modal .components-modal__content {
   1083   padding-bottom: 0;
   1084   display: flex;
   1085   flex-direction: column;
   1086 }
   1087 
   1088 .edit-post-manage-blocks-modal .components-modal__header {
   1089   flex-shrink: 0;
   1090   margin-bottom: 0;
   1091 }
   1092 
   1093 .edit-post-manage-blocks-modal__content {
   1094   display: flex;
   1095   flex-direction: column;
   1096   flex: 0 1 100%;
   1097   min-height: 0;
   1098 }
   1099 
   1100 .edit-post-manage-blocks-modal__no-results {
   1101   font-style: italic;
   1102   padding: 24px 0;
   1103   text-align: center;
   1104 }
   1105 
   1106 .edit-post-manage-blocks-modal__search {
   1107   margin: 16px 0;
   1108 }
   1109 .edit-post-manage-blocks-modal__search .components-base-control__field {
   1110   margin-bottom: 0;
   1111 }
   1112 .edit-post-manage-blocks-modal__search .components-base-control__label {
   1113   margin-top: -4px;
   1114 }
   1115 .edit-post-manage-blocks-modal__search input[type=search].components-text-control__input {
   1116   padding: 8px;
   1117   border-radius: 2px;
   1118 }
   1119 
   1120 .edit-post-manage-blocks-modal__disabled-blocks-count {
   1121   border-top: 1px solid #ddd;
   1122   margin-right: -24px;
   1123   margin-left: -24px;
   1124   padding-top: 0.6rem;
   1125   padding-bottom: 0.6rem;
   1126   padding-right: 24px;
   1127   padding-left: 24px;
   1128   background-color: #f0f0f0;
   1129 }
   1130 
   1131 .edit-post-manage-blocks-modal__category {
   1132   margin: 0 0 2rem 0;
   1133 }
   1134 
   1135 .edit-post-manage-blocks-modal__category-title {
   1136   position: sticky;
   1137   top: 0;
   1138   padding: 16px 0;
   1139   background-color: #fff;
   1140   z-index: 1;
   1141 }
   1142 .edit-post-manage-blocks-modal__category-title .components-base-control__field {
   1143   margin-bottom: 0;
   1144 }
   1145 .edit-post-manage-blocks-modal__category-title .components-checkbox-control__label {
   1146   font-size: 0.9rem;
   1147   font-weight: 600;
   1148 }
   1149 
   1150 .edit-post-manage-blocks-modal__show-all {
   1151   margin-left: 8px;
   1152 }
   1153 
   1154 .edit-post-manage-blocks-modal__checklist {
   1155   margin-top: 0;
   1156 }
   1157 
   1158 .edit-post-manage-blocks-modal__checklist-item {
   1159   margin-bottom: 0;
   1160   padding-right: 16px;
   1161   border-top: 1px solid #ddd;
   1162 }
   1163 .edit-post-manage-blocks-modal__checklist-item:last-child {
   1164   border-bottom: 1px solid #ddd;
   1165 }
   1166 .edit-post-manage-blocks-modal__checklist-item .components-base-control__field {
   1167   align-items: center;
   1168   display: flex;
   1169   margin: 0;
   1170 }
   1171 .components-modal__content .edit-post-manage-blocks-modal__checklist-item.components-checkbox-control__input-container {
   1172   margin: 0 8px;
   1173 }
   1174 .edit-post-manage-blocks-modal__checklist-item .components-checkbox-control__label {
   1175   display: flex;
   1176   align-items: center;
   1177   justify-content: space-between;
   1178   flex-grow: 1;
   1179   padding: 0.6rem 10px 0.6rem 0;
   1180 }
   1181 .edit-post-manage-blocks-modal__checklist-item .block-editor-block-icon {
   1182   margin-left: 10px;
   1183   fill: #1e1e1e;
   1184 }
   1185 
   1186 .edit-post-manage-blocks-modal__results {
   1187   height: 100%;
   1188   overflow: auto;
   1189   margin-right: -32px;
   1190   margin-left: -32px;
   1191   padding-right: 32px;
   1192   padding-left: 32px;
   1193   border-top: 1px solid #ddd;
   1194 }
   1195 
   1196 .edit-post-meta-boxes-area {
   1197   position: relative;
   1198   /**
   1199    * The wordpress default for most meta-box elements is content-box. Some
   1200    * elements such as textarea and input are set to border-box in forms.css.
   1201    * These elements therefore specifically set back to border-box here, while
   1202    * other elements (such as .button) are unaffected by Gutenberg's style
   1203    * because of their higher specificity.
   1204    */
   1205   /* Match width and positioning of the meta boxes. Override default styles. */
   1206   /* Override Default meta box stylings */
   1207 }
   1208 .edit-post-meta-boxes-area__container,
   1209 .edit-post-meta-boxes-area .inside {
   1210   box-sizing: content-box;
   1211 }
   1212 .edit-post-meta-boxes-area textarea,
   1213 .edit-post-meta-boxes-area input {
   1214   box-sizing: border-box;
   1215 }
   1216 .edit-post-meta-boxes-area #poststuff {
   1217   margin: 0 auto;
   1218   padding-top: 0;
   1219   min-width: auto;
   1220 }
   1221 .edit-post-meta-boxes-area #poststuff h3.hndle,
   1222 .edit-post-meta-boxes-area #poststuff .stuffbox > h3,
   1223 .edit-post-meta-boxes-area #poststuff h2.hndle {
   1224   /* WordPress selectors yolo */
   1225   box-sizing: border-box;
   1226   color: inherit;
   1227   font-weight: 600;
   1228   outline: none;
   1229   padding: 15px;
   1230   position: relative;
   1231   width: 100%;
   1232 }
   1233 .edit-post-meta-boxes-area .postbox {
   1234   border: 0;
   1235   color: inherit;
   1236   margin-bottom: 0;
   1237 }
   1238 .edit-post-meta-boxes-area .postbox > .inside {
   1239   border-bottom: 1px solid #ddd;
   1240   color: inherit;
   1241   padding: 0 14px 14px;
   1242   margin: 0;
   1243 }
   1244 .edit-post-meta-boxes-area .postbox .handlediv {
   1245   height: 44px;
   1246   width: 44px;
   1247 }
   1248 .edit-post-meta-boxes-area.is-loading::before {
   1249   position: absolute;
   1250   top: 0;
   1251   right: 0;
   1252   left: 0;
   1253   bottom: 0;
   1254   content: "";
   1255   background: transparent;
   1256   z-index: 1;
   1257 }
   1258 .edit-post-meta-boxes-area .components-spinner {
   1259   position: absolute;
   1260   top: 10px;
   1261   left: 20px;
   1262   z-index: 5;
   1263 }
   1264 .edit-post-meta-boxes-area .is-hidden {
   1265   display: none;
   1266 }
   1267 .edit-post-meta-boxes-area .metabox-location-side .postbox input[type=checkbox] {
   1268   border: 1px solid #757575;
   1269 }
   1270 .edit-post-meta-boxes-area .metabox-location-side .postbox input[type=checkbox]:checked {
   1271   background: #fff;
   1272   border-color: #757575;
   1273 }
   1274 .edit-post-meta-boxes-area .metabox-location-side .postbox input[type=checkbox]::before {
   1275   margin: -3px -4px;
   1276 }
   1277 
   1278 .edit-post-meta-boxes-area__clear {
   1279   clear: both;
   1280 }
   1281 
   1282 .edit-post-preferences-modal {
   1283   min-width: 360px;
   1284   width: 100%;
   1285 }
   1286 @media (min-width: 782px) {
   1287   .edit-post-preferences-modal {
   1288     width: auto;
   1289   }
   1290 }
   1291 @media (min-width: 600px) {
   1292   .edit-post-preferences-modal {
   1293     height: calc(100% - 60px - 60px);
   1294   }
   1295 }
   1296 .edit-post-preferences-modal .components-navigation {
   1297   background-color: #fff;
   1298   margin: -8px;
   1299   padding: 8px;
   1300 }
   1301 .edit-post-preferences-modal .components-navigation .components-navigation__menu {
   1302   margin: 0;
   1303   color: #1e1e1e;
   1304 }
   1305 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item {
   1306   color: #1e1e1e;
   1307 }
   1308 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item > button {
   1309   color: inherit;
   1310   padding: 3px 16px;
   1311   height: 48px;
   1312 }
   1313 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item > button:focus {
   1314   background: #f0f0f0;
   1315   font-weight: 500;
   1316 }
   1317 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item > button:hover {
   1318   color: var(--wp-admin-theme-color);
   1319 }
   1320 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__item .components-toggle-control__label {
   1321   color: inherit;
   1322 }
   1323 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__menu-title-heading {
   1324   color: inherit;
   1325   border-bottom: 1px solid #ddd;
   1326   padding-right: 0;
   1327   padding-left: 0;
   1328 }
   1329 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__back-button {
   1330   color: inherit;
   1331   padding-right: 0;
   1332 }
   1333 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__back-button:hover {
   1334   color: var(--wp-admin-theme-color);
   1335 }
   1336 .edit-post-preferences-modal .components-navigation .components-navigation__menu .edit-post-preferences-modal__custom-fields-confirmation-button {
   1337   width: auto;
   1338 }
   1339 .edit-post-preferences-modal .edit-post-preferences__tabs {
   1340   display: flex;
   1341   flex-direction: row;
   1342 }
   1343 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tabs {
   1344   width: 160px;
   1345 }
   1346 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item {
   1347   border-radius: 2px;
   1348   font-weight: 400;
   1349 }
   1350 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active {
   1351   background: #f0f0f0;
   1352   box-shadow: none;
   1353   font-weight: 500;
   1354 }
   1355 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus:not(:disabled) {
   1356   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   1357 }
   1358 .edit-post-preferences-modal .edit-post-preferences__tabs .components-tab-panel__tab-content {
   1359   width: 500px;
   1360   padding-right: 24px;
   1361 }
   1362 .edit-post-preferences-modal__section {
   1363   margin: 0 0 2.5rem 0;
   1364 }
   1365 .edit-post-preferences-modal__section-title {
   1366   font-size: 0.9rem;
   1367   font-weight: 600;
   1368 }
   1369 .edit-post-preferences-modal__option .components-base-control .components-base-control__field {
   1370   align-items: center;
   1371   display: flex;
   1372   margin-bottom: 0;
   1373 }
   1374 .edit-post-preferences-modal__option .components-base-control .components-base-control__field > label {
   1375   flex-grow: 1;
   1376   padding: 0.6rem 10px 0.6rem 0;
   1377 }
   1378 .edit-post-preferences-modal__custom-fields-confirmation-message, .edit-post-preferences-modal__custom-fields-confirmation-button {
   1379   margin: 0 48px 0.6rem 0;
   1380 }
   1381 @media (min-width: 782px) {
   1382   .edit-post-preferences-modal__custom-fields-confirmation-message, .edit-post-preferences-modal__custom-fields-confirmation-button {
   1383     margin-right: 38px;
   1384   }
   1385 }
   1386 @media (min-width: 600px) {
   1387   .edit-post-preferences-modal__custom-fields-confirmation-message, .edit-post-preferences-modal__custom-fields-confirmation-button {
   1388     max-width: 300px;
   1389   }
   1390 }
   1391 .edit-post-preferences-modal .components-base-control__help {
   1392   margin: -8px 58px 8px 0;
   1393   font-size: 12px;
   1394   font-style: normal;
   1395   color: #757575;
   1396 }
   1397 .edit-post-preferences-modal .edit-post-preferences-modal__section-description {
   1398   margin: -8px 0 8px 0;
   1399   font-size: 12px;
   1400   font-style: normal;
   1401   color: #757575;
   1402 }
   1403 
   1404 .edit-post-editor__inserter-panel,
   1405 .edit-post-editor__list-view-panel {
   1406   height: 100%;
   1407   display: flex;
   1408   flex-direction: column;
   1409 }
   1410 
   1411 .edit-post-editor__list-view-panel {
   1412   min-width: 350px;
   1413 }
   1414 
   1415 .edit-post-editor__inserter-panel-header {
   1416   padding-top: 8px;
   1417   padding-left: 8px;
   1418   display: flex;
   1419   justify-content: flex-end;
   1420 }
   1421 @media (min-width: 782px) {
   1422   .edit-post-editor__inserter-panel-header {
   1423     display: none;
   1424   }
   1425 }
   1426 
   1427 .edit-post-editor__inserter-panel-content,
   1428 .edit-post-editor__list-view-panel-content {
   1429   height: calc(100% - 36px - 8px);
   1430 }
   1431 
   1432 @media (min-width: 782px) {
   1433   .edit-post-editor__inserter-panel-content {
   1434     height: 100%;
   1435   }
   1436 }
   1437 
   1438 .edit-post-editor__list-view-panel-header {
   1439   align-items: center;
   1440   border-bottom: 1px solid #ddd;
   1441   display: flex;
   1442   justify-content: space-between;
   1443   height: 48px;
   1444   padding-right: 16px;
   1445   padding-left: 4px;
   1446 }
   1447 
   1448 .edit-post-editor__list-view-panel-content {
   1449   overflow-y: auto;
   1450   padding: 8px;
   1451 }
   1452 
   1453 .components-panel__header.edit-post-sidebar__panel-tabs {
   1454   justify-content: flex-start;
   1455   padding-right: 0;
   1456   padding-left: 16px;
   1457   border-top: 0;
   1458   margin-top: 0;
   1459 }
   1460 .components-panel__header.edit-post-sidebar__panel-tabs ul {
   1461   display: flex;
   1462 }
   1463 .components-panel__header.edit-post-sidebar__panel-tabs li {
   1464   margin: 0;
   1465 }
   1466 .components-panel__header.edit-post-sidebar__panel-tabs .components-button.has-icon {
   1467   display: none;
   1468   margin: 0 auto 0 0;
   1469   padding: 0;
   1470   min-width: 24px;
   1471   height: 24px;
   1472 }
   1473 @media (min-width: 782px) {
   1474   .components-panel__header.edit-post-sidebar__panel-tabs .components-button.has-icon {
   1475     display: flex;
   1476   }
   1477 }
   1478 
   1479 .components-panel__body.is-opened.edit-post-last-revision__panel {
   1480   padding: 0;
   1481   height: 48px;
   1482 }
   1483 
   1484 .editor-post-last-revision__title.components-button {
   1485   padding: 16px;
   1486 }
   1487 
   1488 .editor-post-author__select {
   1489   margin: -5px 0;
   1490   width: 100%;
   1491 }
   1492 @supports (position: sticky) {
   1493   .editor-post-author__select {
   1494     width: auto;
   1495   }
   1496 }
   1497 
   1498 .edit-post-post-link__link-post-name {
   1499   font-weight: 600;
   1500 }
   1501 
   1502 .edit-post-post-link__preview-label {
   1503   font-weight: 400;
   1504   margin: 0;
   1505 }
   1506 
   1507 .edit-post-post-link__link {
   1508   text-align: right;
   1509   word-wrap: break-word;
   1510   display: block;
   1511 }
   1512 .edit-post-post-link__preview-link-container {
   1513   direction: ltr;
   1514 }
   1515 .edit-post-post-schedule {
   1516   width: 100%;
   1517   position: relative;
   1518   justify-content: left;
   1519 }
   1520 .edit-post-post-schedule span {
   1521   display: block;
   1522   width: 45%;
   1523 }
   1524 
   1525 .components-button.edit-post-post-schedule__toggle {
   1526   text-align: left;
   1527 }
   1528 
   1529 .edit-post-post-schedule__dialog .components-popover__content > div {
   1530   padding: 0;
   1531 }
   1532 
   1533 .editor-post-slug__input {
   1534   margin: -5px 0;
   1535   padding: 2px;
   1536 }
   1537 
   1538 .edit-post-post-status .edit-post-post-publish-dropdown__switch-to-draft {
   1539   margin-top: 15px;
   1540   width: 100%;
   1541   text-align: center;
   1542 }
   1543 
   1544 .edit-post-post-visibility {
   1545   width: 100%;
   1546   justify-content: left;
   1547 }
   1548 .edit-post-post-visibility span {
   1549   display: block;
   1550   width: 45%;
   1551 }
   1552 
   1553 @media (min-width: 782px) {
   1554   .edit-post-post-visibility__dialog .components-popover__content {
   1555     width: 257px;
   1556   }
   1557 }
   1558 
   1559 .edit-post-post-visibility__dialog-legend {
   1560   font-weight: 600;
   1561 }
   1562 
   1563 .edit-post-post-visibility__choice {
   1564   margin: 10px 0;
   1565 }
   1566 
   1567 .edit-post-post-visibility__dialog-radio,
   1568 .edit-post-post-visibility__dialog-label {
   1569   vertical-align: top;
   1570 }
   1571 
   1572 .edit-post-post-visibility__dialog-password-input {
   1573   width: calc(100% - 20px);
   1574   margin-right: 20px;
   1575 }
   1576 
   1577 .edit-post-post-visibility__dialog-info {
   1578   color: #757575;
   1579   padding-right: 20px;
   1580   font-style: italic;
   1581   margin: 4px 0 0;
   1582   line-height: 1.4;
   1583 }
   1584 
   1585 .components-button.edit-post-sidebar__panel-tab {
   1586   border-radius: 0;
   1587   height: 48px;
   1588   background: transparent;
   1589   border: none;
   1590   box-shadow: none;
   1591   cursor: pointer;
   1592   display: inline-block;
   1593   padding: 3px 15px;
   1594   margin-right: 0;
   1595   font-weight: 500;
   1596 }
   1597 .components-button.edit-post-sidebar__panel-tab::after {
   1598   content: attr(data-label);
   1599   display: block;
   1600   font-weight: 600;
   1601   height: 0;
   1602   overflow: hidden;
   1603   speak: none;
   1604   visibility: hidden;
   1605 }
   1606 .components-button.edit-post-sidebar__panel-tab.is-active {
   1607   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) transparent, inset 0 -4px 0 0 var(--wp-admin-theme-color);
   1608   position: relative;
   1609   z-index: 1;
   1610 }
   1611 .components-button.edit-post-sidebar__panel-tab.is-active::before {
   1612   content: "";
   1613   position: absolute;
   1614   top: 0;
   1615   bottom: 1px;
   1616   left: 0;
   1617   right: 0;
   1618   border-bottom: 4px solid transparent;
   1619 }
   1620 .components-button.edit-post-sidebar__panel-tab:focus {
   1621   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   1622   position: relative;
   1623   z-index: 1;
   1624 }
   1625 .components-button.edit-post-sidebar__panel-tab.is-active:focus {
   1626   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 -4px 0 0 var(--wp-admin-theme-color);
   1627 }
   1628 
   1629 @media (min-width: 782px) {
   1630   .edit-post-template__modal .components-base-control {
   1631     width: 320px;
   1632   }
   1633 }
   1634 .edit-post-template__modal .components-modal__header {
   1635   border-bottom: none;
   1636 }
   1637 .edit-post-template__modal .components-modal__content::before {
   1638   margin-bottom: 4px;
   1639 }
   1640 
   1641 .edit-post-template__modal-actions {
   1642   margin-top: 12px;
   1643 }
   1644 
   1645 .edit-post-template-modal__tip {
   1646   padding: 16px 24px;
   1647   background: #f0f0f0;
   1648   border-radius: 2px;
   1649 }
   1650 @media (min-width: 782px) {
   1651   .edit-post-template-modal__tip {
   1652     width: 240px;
   1653   }
   1654 }
   1655 
   1656 .edit-post-template__actions button:not(:last-child) {
   1657   margin-left: 8px;
   1658 }
   1659 
   1660 h2.edit-post-template-summary__title {
   1661   margin: 0;
   1662   line-height: 24px;
   1663 }
   1664 
   1665 .edit-post-text-editor {
   1666   position: relative;
   1667   width: 100%;
   1668   background-color: #fff;
   1669   flex-grow: 1;
   1670 }
   1671 .edit-post-text-editor .editor-post-title.editor-post-title__block {
   1672   max-width: none;
   1673   line-height: 1.4;
   1674 }
   1675 .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input.editor-post-title__input.editor-post-title__input {
   1676   font-family: Menlo, Consolas, monaco, monospace;
   1677   font-size: 2.5em;
   1678   font-weight: normal;
   1679 }
   1680 .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input {
   1681   border: 1px solid #949494;
   1682   margin-bottom: -1px;
   1683   padding: 16px;
   1684 }
   1685 @media (min-width: 600px) {
   1686   .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input {
   1687     padding: 24px;
   1688   }
   1689 }
   1690 .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input:focus {
   1691   border-color: var(--wp-admin-theme-color);
   1692   box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   1693 }
   1694 @media (min-width: 600px) {
   1695   .edit-post-text-editor .editor-post-title.editor-post-title__block {
   1696     padding: 0;
   1697   }
   1698 }
   1699 
   1700 .edit-post-text-editor__body {
   1701   width: 100%;
   1702   padding: 0 12px 12px 12px;
   1703   max-width: 1080px;
   1704   margin-right: auto;
   1705   margin-left: auto;
   1706 }
   1707 @media (min-width: 960px) {
   1708   .edit-post-text-editor__body {
   1709     padding: 16px 24px 96px 24px;
   1710     padding: 0 24px 24px 24px;
   1711   }
   1712 }
   1713 
   1714 .edit-post-text-editor__toolbar {
   1715   position: sticky;
   1716   z-index: 1;
   1717   top: 0;
   1718   right: 0;
   1719   left: 0;
   1720   display: flex;
   1721   background: rgba(255, 255, 255, 0.8);
   1722   padding: 4px 12px;
   1723 }
   1724 @media (min-width: 600px) {
   1725   .edit-post-text-editor__toolbar {
   1726     padding: 12px;
   1727   }
   1728 }
   1729 @media (min-width: 960px) {
   1730   .edit-post-text-editor__toolbar {
   1731     padding: 12px 24px;
   1732   }
   1733 }
   1734 .edit-post-text-editor__toolbar h2 {
   1735   line-height: 36px;
   1736   margin: 0 0 0 auto;
   1737   font-size: 13px;
   1738   color: #1e1e1e;
   1739 }
   1740 .edit-post-text-editor__toolbar .components-button svg {
   1741   order: 1;
   1742 }
   1743 
   1744 .edit-post-visual-editor {
   1745   position: relative;
   1746   display: flex;
   1747   flex-flow: column;
   1748   background-color: #2f2f2f;
   1749   flex: 1 1 auto;
   1750 }
   1751 .edit-post-visual-editor .components-button {
   1752   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   1753   font-size: 13px;
   1754   padding: 6px 12px;
   1755 }
   1756 .edit-post-visual-editor .components-button.is-tertiary, .edit-post-visual-editor .components-button.has-icon {
   1757   padding: 6px;
   1758 }
   1759 @supports (position: sticky) {
   1760   .edit-post-visual-editor {
   1761     flex-basis: 100%;
   1762   }
   1763 }
   1764 
   1765 .edit-post-visual-editor__post-title-wrapper .editor-post-title {
   1766   margin-top: 2em;
   1767   margin-right: auto;
   1768   margin-left: auto;
   1769   margin-bottom: 0;
   1770 }
   1771 
   1772 .edit-post-visual-editor__exit-template-mode {
   1773   position: absolute;
   1774   top: 8px;
   1775   right: 8px;
   1776   color: #fff;
   1777 }
   1778 .edit-post-visual-editor__exit-template-mode:active:not([aria-disabled=true]), .edit-post-visual-editor__exit-template-mode:focus:not([aria-disabled=true]), .edit-post-visual-editor__exit-template-mode:hover {
   1779   color: #f0f0f0;
   1780 }
   1781 
   1782 .edit-post-visual-editor__content-area {
   1783   width: 100%;
   1784   height: 100%;
   1785   position: relative;
   1786   display: flex;
   1787 }
   1788 
   1789 .edit-post-welcome-guide {
   1790   width: 312px;
   1791 }
   1792 .edit-post-welcome-guide__image {
   1793   background: #00a0d2;
   1794   margin: 0 0 16px;
   1795 }
   1796 .edit-post-welcome-guide__heading {
   1797   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   1798   font-size: 24px;
   1799   line-height: 1.4;
   1800   margin: 16px 0 16px 0;
   1801   padding: 0 32px;
   1802 }
   1803 .edit-post-welcome-guide__text {
   1804   font-size: 13px;
   1805   line-height: 1.4;
   1806   margin: 0 0 24px 0;
   1807   padding: 0 32px;
   1808 }
   1809 .edit-post-welcome-guide__inserter-icon {
   1810   margin: 0 4px;
   1811   vertical-align: text-top;
   1812 }
   1813 
   1814 /**
   1815  * Animations
   1816  */
   1817 @keyframes edit-post__fade-in-animation {
   1818   from {
   1819     opacity: 0;
   1820   }
   1821   to {
   1822     opacity: 1;
   1823   }
   1824 }
   1825 html.wp-toolbar {
   1826   background: #fff;
   1827 }
   1828 
   1829 body.block-editor-page {
   1830   background: #fff;
   1831   /* We hide legacy notices in Gutenberg Based Pages, because they were not designed in a way that scaled well.
   1832      Plugins can use Gutenberg notices if they need to pass on information to the user when they are editing. */
   1833 }
   1834 body.block-editor-page #wpcontent {
   1835   padding-right: 0;
   1836 }
   1837 body.block-editor-page #wpbody-content {
   1838   padding-bottom: 0;
   1839 }
   1840 body.block-editor-page #wpbody-content > div:not(.block-editor):not(#screen-meta) {
   1841   display: none;
   1842 }
   1843 body.block-editor-page #wpfooter {
   1844   display: none;
   1845 }
   1846 body.block-editor-page .a11y-speak-region {
   1847   right: -1px;
   1848   top: -1px;
   1849 }
   1850 body.block-editor-page ul#adminmenu a.wp-has-current-submenu::after,
   1851 body.block-editor-page ul#adminmenu > li.current > a.current::after {
   1852   border-left-color: #fff;
   1853 }
   1854 body.block-editor-page .media-frame select.attachment-filters:last-of-type {
   1855   width: auto;
   1856   max-width: 100%;
   1857 }
   1858 
   1859 .block-editor-page #wpwrap {
   1860   overflow-y: auto;
   1861 }
   1862 @media (min-width: 782px) {
   1863   .block-editor-page #wpwrap {
   1864     overflow-y: initial;
   1865   }
   1866 }
   1867 
   1868 .edit-post-header,
   1869 .edit-post-visual-editor,
   1870 .edit-post-text-editor,
   1871 .edit-post-sidebar,
   1872 .editor-post-publish-panel,
   1873 .components-popover,
   1874 .components-modal__frame,
   1875 .edit-post-editor__inserter-panel {
   1876   box-sizing: border-box;
   1877 }
   1878 .edit-post-header *,
   1879 .edit-post-header *::before,
   1880 .edit-post-header *::after,
   1881 .edit-post-visual-editor *,
   1882 .edit-post-visual-editor *::before,
   1883 .edit-post-visual-editor *::after,
   1884 .edit-post-text-editor *,
   1885 .edit-post-text-editor *::before,
   1886 .edit-post-text-editor *::after,
   1887 .edit-post-sidebar *,
   1888 .edit-post-sidebar *::before,
   1889 .edit-post-sidebar *::after,
   1890 .editor-post-publish-panel *,
   1891 .editor-post-publish-panel *::before,
   1892 .editor-post-publish-panel *::after,
   1893 .components-popover *,
   1894 .components-popover *::before,
   1895 .components-popover *::after,
   1896 .components-modal__frame *,
   1897 .components-modal__frame *::before,
   1898 .components-modal__frame *::after,
   1899 .edit-post-editor__inserter-panel *,
   1900 .edit-post-editor__inserter-panel *::before,
   1901 .edit-post-editor__inserter-panel *::after {
   1902   box-sizing: inherit;
   1903 }
   1904 
   1905 @media (min-width: 600px) {
   1906   .block-editor__container {
   1907     position: absolute;
   1908     top: 0;
   1909     left: 0;
   1910     bottom: 0;
   1911     right: 0;
   1912     min-height: calc(100vh - 46px);
   1913   }
   1914 }
   1915 @media (min-width: 782px) {
   1916   .block-editor__container {
   1917     min-height: calc(100vh - 32px);
   1918   }
   1919   body.is-fullscreen-mode .block-editor__container {
   1920     min-height: 100vh;
   1921   }
   1922 }
   1923 .block-editor__container img {
   1924   max-width: 100%;
   1925   height: auto;
   1926 }
   1927 .block-editor__container iframe {
   1928   width: 100%;
   1929 }
   1930 
   1931 body.admin-color-light {
   1932   --wp-admin-theme-color: #0085ba;
   1933   --wp-admin-theme-color-darker-10: #0073a1;
   1934   --wp-admin-theme-color-darker-20: #006187;
   1935   --wp-admin-border-width-focus: 2px;
   1936 }
   1937 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1938   body.admin-color-light {
   1939     --wp-admin-border-width-focus: 1.5px;
   1940   }
   1941 }
   1942 
   1943 body.admin-color-modern {
   1944   --wp-admin-theme-color: #3858e9;
   1945   --wp-admin-theme-color-darker-10: #2145e6;
   1946   --wp-admin-theme-color-darker-20: #183ad6;
   1947   --wp-admin-border-width-focus: 2px;
   1948 }
   1949 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1950   body.admin-color-modern {
   1951     --wp-admin-border-width-focus: 1.5px;
   1952   }
   1953 }
   1954 
   1955 body.admin-color-blue {
   1956   --wp-admin-theme-color: #096484;
   1957   --wp-admin-theme-color-darker-10: #07526c;
   1958   --wp-admin-theme-color-darker-20: #064054;
   1959   --wp-admin-border-width-focus: 2px;
   1960 }
   1961 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1962   body.admin-color-blue {
   1963     --wp-admin-border-width-focus: 1.5px;
   1964   }
   1965 }
   1966 
   1967 body.admin-color-coffee {
   1968   --wp-admin-theme-color: #46403c;
   1969   --wp-admin-theme-color-darker-10: #383330;
   1970   --wp-admin-theme-color-darker-20: #2b2724;
   1971   --wp-admin-border-width-focus: 2px;
   1972 }
   1973 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1974   body.admin-color-coffee {
   1975     --wp-admin-border-width-focus: 1.5px;
   1976   }
   1977 }
   1978 
   1979 body.admin-color-ectoplasm {
   1980   --wp-admin-theme-color: #523f6d;
   1981   --wp-admin-theme-color-darker-10: #46365d;
   1982   --wp-admin-theme-color-darker-20: #3a2c4d;
   1983   --wp-admin-border-width-focus: 2px;
   1984 }
   1985 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1986   body.admin-color-ectoplasm {
   1987     --wp-admin-border-width-focus: 1.5px;
   1988   }
   1989 }
   1990 
   1991 body.admin-color-midnight {
   1992   --wp-admin-theme-color: #e14d43;
   1993   --wp-admin-theme-color-darker-10: #dd382d;
   1994   --wp-admin-theme-color-darker-20: #d02c21;
   1995   --wp-admin-border-width-focus: 2px;
   1996 }
   1997 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1998   body.admin-color-midnight {
   1999     --wp-admin-border-width-focus: 1.5px;
   2000   }
   2001 }
   2002 
   2003 body.admin-color-ocean {
   2004   --wp-admin-theme-color: #627c83;
   2005   --wp-admin-theme-color-darker-10: #576e74;
   2006   --wp-admin-theme-color-darker-20: #4c6066;
   2007   --wp-admin-border-width-focus: 2px;
   2008 }
   2009 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   2010   body.admin-color-ocean {
   2011     --wp-admin-border-width-focus: 1.5px;
   2012   }
   2013 }
   2014 
   2015 body.admin-color-sunrise {
   2016   --wp-admin-theme-color: #dd823b;
   2017   --wp-admin-theme-color-darker-10: #d97426;
   2018   --wp-admin-theme-color-darker-20: #c36922;
   2019   --wp-admin-border-width-focus: 2px;
   2020 }
   2021 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   2022   body.admin-color-sunrise {
   2023     --wp-admin-border-width-focus: 1.5px;
   2024   }
   2025 }