balmet.com

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

style.css (54074B)


      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-right: 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-right: 4px;
    102 }
    103 .interface-complementary-area-header .components-button.has-icon {
    104   display: none;
    105   margin-left: auto;
    106 }
    107 .interface-complementary-area-header .components-button.has-icon ~ .components-button {
    108   margin-left: 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   right: 10px;
    174   bottom: 10px;
    175   left: 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-left: 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   left: 0;
    212   right: 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   left: 0;
    234 }
    235 @media (min-width: 783px) {
    236   .interface-interface-skeleton {
    237     left: 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     left: 36px;
    247   }
    248 }
    249 @media (min-width: 961px) {
    250   .auto-fold .interface-interface-skeleton {
    251     left: 160px;
    252   }
    253 }
    254 
    255 /* Sidebar manually collapsed. */
    256 .folded .interface-interface-skeleton {
    257   left: 0;
    258 }
    259 @media (min-width: 783px) {
    260   .folded .interface-interface-skeleton {
    261     left: 36px;
    262   }
    263 }
    264 
    265 body.is-fullscreen-mode .interface-interface-skeleton {
    266   left: 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   right: 0;
    297   bottom: 0;
    298   left: 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-left: 1px solid #e0e0e0;
    317   }
    318 }
    319 
    320 @media (min-width: 782px) {
    321   .interface-interface-skeleton__secondary-sidebar {
    322     border-right: 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   left: 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   left: auto;
    368   right: 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-left: 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-right: 4px;
    436   /**
    437    * Buttons in the Toolbar
    438   	 */
    439 }
    440 @media (min-width: 600px) {
    441   .edit-post-header__settings {
    442     padding-right: 16px;
    443   }
    444 }
    445 .edit-post-header__settings .editor-post-saved-state,
    446 .edit-post-header__settings .components-button.components-button {
    447   margin-right: 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-right: 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-right: 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-left: 8px;
    472   margin-right: auto;
    473   width: 100%;
    474   display: flex;
    475   justify-content: flex-start;
    476 }
    477 .edit-post-header-preview__button-external svg {
    478   margin-left: 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-left: 8px;
    544   padding-right: 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-left: 12px;
    554     padding-right: 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-left: 8px;
    561   padding-left: 8px;
    562   padding-right: 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-left: 12px;
    569     padding-left: 12px;
    570     padding-right: 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 6px 6px 40px;
    598   width: 14.625rem;
    599   text-align: left;
    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-left: -12px;
    608   margin-right: -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 6px 6px 8px;
    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-left: 40px;
    624 }
    625 .show-icon-labels.interface-pinned-items > .components-button.has-icon svg {
    626   margin-right: 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     right: 9px;
    659     bottom: 9px;
    660     left: 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-left: 8px;
    767 }
    768 @media (min-width: 600px) {
    769   .edit-post-header-toolbar__left {
    770     padding-left: 24px;
    771   }
    772 }
    773 @media (min-width: 1280px) {
    774   .edit-post-header-toolbar__left {
    775     padding-right: 8px;
    776   }
    777 }
    778 
    779 .edit-post-header-toolbar .edit-post-header-toolbar__left > .edit-post-header-toolbar__inserter-toggle.has-icon {
    780   margin-right: 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-left: 8px;
    797 }
    798 
    799 .edit-post-more-menu {
    800   margin-left: -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-left: 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-right: 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   left: 0;
    867   right: 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-left: -12px;
    881   margin-right: -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-right: 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 0 0 1rem;
    920   text-align: right;
    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 0 0.2rem;
    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   right: 0;
    961   bottom: 40px;
    962   padding-left: 16px;
    963   padding-right: 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   left: 0;
    969 }
    970 @media (min-width: 783px) {
    971   .edit-post-layout .components-editor-notices__snackbar {
    972     left: 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     left: 36px;
    982   }
    983 }
    984 @media (min-width: 961px) {
    985   .auto-fold .edit-post-layout .components-editor-notices__snackbar {
    986     left: 160px;
    987   }
    988 }
    989 
    990 /* Sidebar manually collapsed. */
    991 .folded .edit-post-layout .components-editor-notices__snackbar {
    992   left: 0;
    993 }
    994 @media (min-width: 783px) {
    995   .folded .edit-post-layout .components-editor-notices__snackbar {
    996     left: 36px;
    997   }
    998 }
    999 
   1000 body.is-fullscreen-mode .edit-post-layout .components-editor-notices__snackbar {
   1001   left: 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   right: 0;
   1010   left: 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     left: auto;
   1018     width: 281px;
   1019     border-left: 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   left: auto;
   1058   right: 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-left: -24px;
   1123   margin-right: -24px;
   1124   padding-top: 0.6rem;
   1125   padding-bottom: 0.6rem;
   1126   padding-left: 24px;
   1127   padding-right: 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-right: 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-left: 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 0 0.6rem 10px;
   1180 }
   1181 .edit-post-manage-blocks-modal__checklist-item .block-editor-block-icon {
   1182   margin-right: 10px;
   1183   fill: #1e1e1e;
   1184 }
   1185 
   1186 .edit-post-manage-blocks-modal__results {
   1187   height: 100%;
   1188   overflow: auto;
   1189   margin-left: -32px;
   1190   margin-right: -32px;
   1191   padding-left: 32px;
   1192   padding-right: 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   left: 0;
   1252   right: 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   right: 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-left: 0;
   1327   padding-right: 0;
   1328 }
   1329 .edit-post-preferences-modal .components-navigation .components-navigation__menu .components-navigation__back-button {
   1330   color: inherit;
   1331   padding-left: 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-left: 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 0 0.6rem 10px;
   1377 }
   1378 .edit-post-preferences-modal__custom-fields-confirmation-message, .edit-post-preferences-modal__custom-fields-confirmation-button {
   1379   margin: 0 0 0.6rem 48px;
   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-left: 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 0 8px 58px;
   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-right: 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-left: 16px;
   1445   padding-right: 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-left: 0;
   1456   padding-right: 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 0 0 auto;
   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: left;
   1509   word-wrap: break-word;
   1510   display: block;
   1511 }
   1512 
   1513 /* rtl:begin:ignore */
   1514 .edit-post-post-link__preview-link-container {
   1515   direction: ltr;
   1516 }
   1517 
   1518 /* rtl:end:ignore */
   1519 .edit-post-post-schedule {
   1520   width: 100%;
   1521   position: relative;
   1522   justify-content: left;
   1523 }
   1524 .edit-post-post-schedule span {
   1525   display: block;
   1526   width: 45%;
   1527 }
   1528 
   1529 .components-button.edit-post-post-schedule__toggle {
   1530   text-align: right;
   1531 }
   1532 
   1533 .edit-post-post-schedule__dialog .components-popover__content > div {
   1534   padding: 0;
   1535 }
   1536 
   1537 .editor-post-slug__input {
   1538   margin: -5px 0;
   1539   padding: 2px;
   1540 }
   1541 
   1542 .edit-post-post-status .edit-post-post-publish-dropdown__switch-to-draft {
   1543   margin-top: 15px;
   1544   width: 100%;
   1545   text-align: center;
   1546 }
   1547 
   1548 .edit-post-post-visibility {
   1549   width: 100%;
   1550   justify-content: left;
   1551 }
   1552 .edit-post-post-visibility span {
   1553   display: block;
   1554   width: 45%;
   1555 }
   1556 
   1557 @media (min-width: 782px) {
   1558   .edit-post-post-visibility__dialog .components-popover__content {
   1559     width: 257px;
   1560   }
   1561 }
   1562 
   1563 .edit-post-post-visibility__dialog-legend {
   1564   font-weight: 600;
   1565 }
   1566 
   1567 .edit-post-post-visibility__choice {
   1568   margin: 10px 0;
   1569 }
   1570 
   1571 .edit-post-post-visibility__dialog-radio,
   1572 .edit-post-post-visibility__dialog-label {
   1573   vertical-align: top;
   1574 }
   1575 
   1576 .edit-post-post-visibility__dialog-password-input {
   1577   width: calc(100% - 20px);
   1578   margin-left: 20px;
   1579 }
   1580 
   1581 .edit-post-post-visibility__dialog-info {
   1582   color: #757575;
   1583   padding-left: 20px;
   1584   font-style: italic;
   1585   margin: 4px 0 0;
   1586   line-height: 1.4;
   1587 }
   1588 
   1589 .components-button.edit-post-sidebar__panel-tab {
   1590   border-radius: 0;
   1591   height: 48px;
   1592   background: transparent;
   1593   border: none;
   1594   box-shadow: none;
   1595   cursor: pointer;
   1596   display: inline-block;
   1597   padding: 3px 15px;
   1598   margin-left: 0;
   1599   font-weight: 500;
   1600 }
   1601 .components-button.edit-post-sidebar__panel-tab::after {
   1602   content: attr(data-label);
   1603   display: block;
   1604   font-weight: 600;
   1605   height: 0;
   1606   overflow: hidden;
   1607   speak: none;
   1608   visibility: hidden;
   1609 }
   1610 .components-button.edit-post-sidebar__panel-tab.is-active {
   1611   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) transparent, inset 0 -4px 0 0 var(--wp-admin-theme-color);
   1612   position: relative;
   1613   z-index: 1;
   1614 }
   1615 .components-button.edit-post-sidebar__panel-tab.is-active::before {
   1616   content: "";
   1617   position: absolute;
   1618   top: 0;
   1619   bottom: 1px;
   1620   right: 0;
   1621   left: 0;
   1622   border-bottom: 4px solid transparent;
   1623 }
   1624 .components-button.edit-post-sidebar__panel-tab:focus {
   1625   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   1626   position: relative;
   1627   z-index: 1;
   1628 }
   1629 .components-button.edit-post-sidebar__panel-tab.is-active:focus {
   1630   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);
   1631 }
   1632 
   1633 @media (min-width: 782px) {
   1634   .edit-post-template__modal .components-base-control {
   1635     width: 320px;
   1636   }
   1637 }
   1638 .edit-post-template__modal .components-modal__header {
   1639   border-bottom: none;
   1640 }
   1641 .edit-post-template__modal .components-modal__content::before {
   1642   margin-bottom: 4px;
   1643 }
   1644 
   1645 .edit-post-template__modal-actions {
   1646   margin-top: 12px;
   1647 }
   1648 
   1649 .edit-post-template-modal__tip {
   1650   padding: 16px 24px;
   1651   background: #f0f0f0;
   1652   border-radius: 2px;
   1653 }
   1654 @media (min-width: 782px) {
   1655   .edit-post-template-modal__tip {
   1656     width: 240px;
   1657   }
   1658 }
   1659 
   1660 .edit-post-template__actions button:not(:last-child) {
   1661   margin-right: 8px;
   1662 }
   1663 
   1664 h2.edit-post-template-summary__title {
   1665   margin: 0;
   1666   line-height: 24px;
   1667 }
   1668 
   1669 .edit-post-text-editor {
   1670   position: relative;
   1671   width: 100%;
   1672   background-color: #fff;
   1673   flex-grow: 1;
   1674 }
   1675 .edit-post-text-editor .editor-post-title.editor-post-title__block {
   1676   max-width: none;
   1677   line-height: 1.4;
   1678 }
   1679 .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input.editor-post-title__input.editor-post-title__input {
   1680   font-family: Menlo, Consolas, monaco, monospace;
   1681   font-size: 2.5em;
   1682   font-weight: normal;
   1683 }
   1684 .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input {
   1685   border: 1px solid #949494;
   1686   margin-bottom: -1px;
   1687   padding: 16px;
   1688 }
   1689 @media (min-width: 600px) {
   1690   .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input {
   1691     padding: 24px;
   1692   }
   1693 }
   1694 .edit-post-text-editor .editor-post-title.editor-post-title__block .editor-post-title__input:focus {
   1695   border-color: var(--wp-admin-theme-color);
   1696   box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   1697 }
   1698 @media (min-width: 600px) {
   1699   .edit-post-text-editor .editor-post-title.editor-post-title__block {
   1700     padding: 0;
   1701   }
   1702 }
   1703 
   1704 .edit-post-text-editor__body {
   1705   width: 100%;
   1706   padding: 0 12px 12px 12px;
   1707   max-width: 1080px;
   1708   margin-left: auto;
   1709   margin-right: auto;
   1710 }
   1711 @media (min-width: 960px) {
   1712   .edit-post-text-editor__body {
   1713     padding: 16px 24px 96px 24px;
   1714     padding: 0 24px 24px 24px;
   1715   }
   1716 }
   1717 
   1718 .edit-post-text-editor__toolbar {
   1719   position: sticky;
   1720   z-index: 1;
   1721   top: 0;
   1722   left: 0;
   1723   right: 0;
   1724   display: flex;
   1725   background: rgba(255, 255, 255, 0.8);
   1726   padding: 4px 12px;
   1727 }
   1728 @media (min-width: 600px) {
   1729   .edit-post-text-editor__toolbar {
   1730     padding: 12px;
   1731   }
   1732 }
   1733 @media (min-width: 960px) {
   1734   .edit-post-text-editor__toolbar {
   1735     padding: 12px 24px;
   1736   }
   1737 }
   1738 .edit-post-text-editor__toolbar h2 {
   1739   line-height: 36px;
   1740   margin: 0 auto 0 0;
   1741   font-size: 13px;
   1742   color: #1e1e1e;
   1743 }
   1744 .edit-post-text-editor__toolbar .components-button svg {
   1745   order: 1;
   1746 }
   1747 
   1748 .edit-post-visual-editor {
   1749   position: relative;
   1750   display: flex;
   1751   flex-flow: column;
   1752   background-color: #2f2f2f;
   1753   flex: 1 1 auto;
   1754 }
   1755 .edit-post-visual-editor .components-button {
   1756   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   1757   font-size: 13px;
   1758   padding: 6px 12px;
   1759 }
   1760 .edit-post-visual-editor .components-button.is-tertiary, .edit-post-visual-editor .components-button.has-icon {
   1761   padding: 6px;
   1762 }
   1763 @supports (position: sticky) {
   1764   .edit-post-visual-editor {
   1765     flex-basis: 100%;
   1766   }
   1767 }
   1768 
   1769 .edit-post-visual-editor__post-title-wrapper .editor-post-title {
   1770   margin-top: 2em;
   1771   margin-left: auto;
   1772   margin-right: auto;
   1773   margin-bottom: 0;
   1774 }
   1775 
   1776 .edit-post-visual-editor__exit-template-mode {
   1777   position: absolute;
   1778   top: 8px;
   1779   left: 8px;
   1780   color: #fff;
   1781 }
   1782 .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 {
   1783   color: #f0f0f0;
   1784 }
   1785 
   1786 .edit-post-visual-editor__content-area {
   1787   width: 100%;
   1788   height: 100%;
   1789   position: relative;
   1790   display: flex;
   1791 }
   1792 
   1793 .edit-post-welcome-guide {
   1794   width: 312px;
   1795 }
   1796 .edit-post-welcome-guide__image {
   1797   background: #00a0d2;
   1798   margin: 0 0 16px;
   1799 }
   1800 .edit-post-welcome-guide__heading {
   1801   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
   1802   font-size: 24px;
   1803   line-height: 1.4;
   1804   margin: 16px 0 16px 0;
   1805   padding: 0 32px;
   1806 }
   1807 .edit-post-welcome-guide__text {
   1808   font-size: 13px;
   1809   line-height: 1.4;
   1810   margin: 0 0 24px 0;
   1811   padding: 0 32px;
   1812 }
   1813 .edit-post-welcome-guide__inserter-icon {
   1814   margin: 0 4px;
   1815   vertical-align: text-top;
   1816 }
   1817 
   1818 /**
   1819  * Animations
   1820  */
   1821 @keyframes edit-post__fade-in-animation {
   1822   from {
   1823     opacity: 0;
   1824   }
   1825   to {
   1826     opacity: 1;
   1827   }
   1828 }
   1829 html.wp-toolbar {
   1830   background: #fff;
   1831 }
   1832 
   1833 body.block-editor-page {
   1834   background: #fff;
   1835   /* We hide legacy notices in Gutenberg Based Pages, because they were not designed in a way that scaled well.
   1836      Plugins can use Gutenberg notices if they need to pass on information to the user when they are editing. */
   1837 }
   1838 body.block-editor-page #wpcontent {
   1839   padding-left: 0;
   1840 }
   1841 body.block-editor-page #wpbody-content {
   1842   padding-bottom: 0;
   1843 }
   1844 body.block-editor-page #wpbody-content > div:not(.block-editor):not(#screen-meta) {
   1845   display: none;
   1846 }
   1847 body.block-editor-page #wpfooter {
   1848   display: none;
   1849 }
   1850 body.block-editor-page .a11y-speak-region {
   1851   left: -1px;
   1852   top: -1px;
   1853 }
   1854 body.block-editor-page ul#adminmenu a.wp-has-current-submenu::after,
   1855 body.block-editor-page ul#adminmenu > li.current > a.current::after {
   1856   border-right-color: #fff;
   1857 }
   1858 body.block-editor-page .media-frame select.attachment-filters:last-of-type {
   1859   width: auto;
   1860   max-width: 100%;
   1861 }
   1862 
   1863 .block-editor-page #wpwrap {
   1864   overflow-y: auto;
   1865 }
   1866 @media (min-width: 782px) {
   1867   .block-editor-page #wpwrap {
   1868     overflow-y: initial;
   1869   }
   1870 }
   1871 
   1872 .edit-post-header,
   1873 .edit-post-visual-editor,
   1874 .edit-post-text-editor,
   1875 .edit-post-sidebar,
   1876 .editor-post-publish-panel,
   1877 .components-popover,
   1878 .components-modal__frame,
   1879 .edit-post-editor__inserter-panel {
   1880   box-sizing: border-box;
   1881 }
   1882 .edit-post-header *,
   1883 .edit-post-header *::before,
   1884 .edit-post-header *::after,
   1885 .edit-post-visual-editor *,
   1886 .edit-post-visual-editor *::before,
   1887 .edit-post-visual-editor *::after,
   1888 .edit-post-text-editor *,
   1889 .edit-post-text-editor *::before,
   1890 .edit-post-text-editor *::after,
   1891 .edit-post-sidebar *,
   1892 .edit-post-sidebar *::before,
   1893 .edit-post-sidebar *::after,
   1894 .editor-post-publish-panel *,
   1895 .editor-post-publish-panel *::before,
   1896 .editor-post-publish-panel *::after,
   1897 .components-popover *,
   1898 .components-popover *::before,
   1899 .components-popover *::after,
   1900 .components-modal__frame *,
   1901 .components-modal__frame *::before,
   1902 .components-modal__frame *::after,
   1903 .edit-post-editor__inserter-panel *,
   1904 .edit-post-editor__inserter-panel *::before,
   1905 .edit-post-editor__inserter-panel *::after {
   1906   box-sizing: inherit;
   1907 }
   1908 
   1909 @media (min-width: 600px) {
   1910   .block-editor__container {
   1911     position: absolute;
   1912     top: 0;
   1913     right: 0;
   1914     bottom: 0;
   1915     left: 0;
   1916     min-height: calc(100vh - 46px);
   1917   }
   1918 }
   1919 @media (min-width: 782px) {
   1920   .block-editor__container {
   1921     min-height: calc(100vh - 32px);
   1922   }
   1923   body.is-fullscreen-mode .block-editor__container {
   1924     min-height: 100vh;
   1925   }
   1926 }
   1927 .block-editor__container img {
   1928   max-width: 100%;
   1929   height: auto;
   1930 }
   1931 .block-editor__container iframe {
   1932   width: 100%;
   1933 }
   1934 
   1935 body.admin-color-light {
   1936   --wp-admin-theme-color: #0085ba;
   1937   --wp-admin-theme-color-darker-10: #0073a1;
   1938   --wp-admin-theme-color-darker-20: #006187;
   1939   --wp-admin-border-width-focus: 2px;
   1940 }
   1941 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1942   body.admin-color-light {
   1943     --wp-admin-border-width-focus: 1.5px;
   1944   }
   1945 }
   1946 
   1947 body.admin-color-modern {
   1948   --wp-admin-theme-color: #3858e9;
   1949   --wp-admin-theme-color-darker-10: #2145e6;
   1950   --wp-admin-theme-color-darker-20: #183ad6;
   1951   --wp-admin-border-width-focus: 2px;
   1952 }
   1953 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1954   body.admin-color-modern {
   1955     --wp-admin-border-width-focus: 1.5px;
   1956   }
   1957 }
   1958 
   1959 body.admin-color-blue {
   1960   --wp-admin-theme-color: #096484;
   1961   --wp-admin-theme-color-darker-10: #07526c;
   1962   --wp-admin-theme-color-darker-20: #064054;
   1963   --wp-admin-border-width-focus: 2px;
   1964 }
   1965 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1966   body.admin-color-blue {
   1967     --wp-admin-border-width-focus: 1.5px;
   1968   }
   1969 }
   1970 
   1971 body.admin-color-coffee {
   1972   --wp-admin-theme-color: #46403c;
   1973   --wp-admin-theme-color-darker-10: #383330;
   1974   --wp-admin-theme-color-darker-20: #2b2724;
   1975   --wp-admin-border-width-focus: 2px;
   1976 }
   1977 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1978   body.admin-color-coffee {
   1979     --wp-admin-border-width-focus: 1.5px;
   1980   }
   1981 }
   1982 
   1983 body.admin-color-ectoplasm {
   1984   --wp-admin-theme-color: #523f6d;
   1985   --wp-admin-theme-color-darker-10: #46365d;
   1986   --wp-admin-theme-color-darker-20: #3a2c4d;
   1987   --wp-admin-border-width-focus: 2px;
   1988 }
   1989 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   1990   body.admin-color-ectoplasm {
   1991     --wp-admin-border-width-focus: 1.5px;
   1992   }
   1993 }
   1994 
   1995 body.admin-color-midnight {
   1996   --wp-admin-theme-color: #e14d43;
   1997   --wp-admin-theme-color-darker-10: #dd382d;
   1998   --wp-admin-theme-color-darker-20: #d02c21;
   1999   --wp-admin-border-width-focus: 2px;
   2000 }
   2001 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   2002   body.admin-color-midnight {
   2003     --wp-admin-border-width-focus: 1.5px;
   2004   }
   2005 }
   2006 
   2007 body.admin-color-ocean {
   2008   --wp-admin-theme-color: #627c83;
   2009   --wp-admin-theme-color-darker-10: #576e74;
   2010   --wp-admin-theme-color-darker-20: #4c6066;
   2011   --wp-admin-border-width-focus: 2px;
   2012 }
   2013 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   2014   body.admin-color-ocean {
   2015     --wp-admin-border-width-focus: 1.5px;
   2016   }
   2017 }
   2018 
   2019 body.admin-color-sunrise {
   2020   --wp-admin-theme-color: #dd823b;
   2021   --wp-admin-theme-color-darker-10: #d97426;
   2022   --wp-admin-theme-color-darker-20: #c36922;
   2023   --wp-admin-border-width-focus: 2px;
   2024 }
   2025 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
   2026   body.admin-color-sunrise {
   2027     --wp-admin-border-width-focus: 1.5px;
   2028   }
   2029 }