[ Index ]

WordPress 5.4.1

[ Index ]     [ Classes ]     [ Functions ]     [ Variables ]     [ Constants ]     [ Statistics ]    

title

Body

[close]

/wp-includes/css/dist/components/ -> style.css (source)

   1  /**
   2   * Colors
   3   */
   4  /**
   5   * Breakpoints & Media Queries
   6   */
   7  /**
   8   * Colors
   9   */
  10  /**
  11   * Often re-used variables
  12   */
  13  /**
  14   * Breakpoint mixins
  15   */
  16  /**
  17   * Long content fade mixin
  18   *
  19   * Creates a fading overlay to signify that the content is longer
  20   * than the space allows.
  21   */
  22  /**
  23   * Button states and focus styles
  24   */
  25  /**
  26   * Applies editor left position to the selector passed as argument
  27   */
  28  /**
  29   * Styles that are reused verbatim in a few places
  30   */
  31  /**
  32   * Allows users to opt-out of animations via OS-level preferences.
  33   */
  34  /**
  35   * Reset default styles for JavaScript UI based pages.
  36   * This is a WP-admin agnostic reset
  37   */
  38  /**
  39   * Reset the WP Admin page styles for Gutenberg-like pages.
  40   */
  41  .components-animate__appear {
  42    animation: components-animate__appear-animation 0.1s cubic-bezier(0, 0, 0.2, 1) 0s;
  43    animation-fill-mode: forwards; }
  44    @media (prefers-reduced-motion: reduce) {
  45      .components-animate__appear {
  46        animation-duration: 1ms; } }
  47    .components-animate__appear.is-from-top, .components-animate__appear.is-from-top.is-from-left {
  48      transform-origin: top left; }
  49    .components-animate__appear.is-from-top.is-from-right {
  50      transform-origin: top right; }
  51    .components-animate__appear.is-from-bottom, .components-animate__appear.is-from-bottom.is-from-left {
  52      transform-origin: bottom left; }
  53    .components-animate__appear.is-from-bottom.is-from-right {
  54      transform-origin: bottom right; }
  55  
  56  @keyframes components-animate__appear-animation {
  57    from {
  58      transform: translateY(-2em) scaleY(0) scaleX(0); }
  59    to {
  60      transform: translateY(0%) scaleY(1) scaleX(1); } }
  61  
  62  .components-animate__slide-in {
  63    animation: components-animate__slide-in-animation 0.1s cubic-bezier(0, 0, 0.2, 1);
  64    animation-fill-mode: forwards; }
  65    @media (prefers-reduced-motion: reduce) {
  66      .components-animate__slide-in {
  67        animation-duration: 1ms; } }
  68    .components-animate__slide-in.is-from-left {
  69      transform: translateX(100%); }
  70  
  71  @keyframes components-animate__slide-in-animation {
  72    100% {
  73      transform: translateX(0%); } }
  74  
  75  .components-animate__loading {
  76    animation: components-animate__loading 1.6s ease-in-out infinite; }
  77  
  78  @keyframes components-animate__loading {
  79    0% {
  80      opacity: 0.5; }
  81    50% {
  82      opacity: 1; }
  83    100% {
  84      opacity: 0.5; } }
  85  
  86  .components-angle-picker-control {
  87    width: 50%; }
  88    .components-angle-picker-control.components-base-control .components-base-control__label {
  89      display: block; }
  90  
  91  .components-angle-picker-control__input-field {
  92    width: calc(100% - 36px);
  93    max-width: 100px; }
  94  
  95  .components-angle-picker-control__angle-circle {
  96    width: 28px;
  97    height: 28px;
  98    border: 2px solid #555d66;
  99    border-radius: 50%;
 100    float: left;
 101    margin-right: 4px;
 102    cursor: grab; }
 103  
 104  .components-angle-picker-control__angle-circle-indicator-wrapper {
 105    position: relative;
 106    width: 100%;
 107    height: 100%; }
 108  
 109  .components-angle-picker-control__angle-circle-indicator {
 110    width: 1px;
 111    height: 1px;
 112    border-radius: 50%;
 113    border: 3px solid #555d66;
 114    display: block;
 115    position: absolute;
 116    top: -14px;
 117    bottom: 0;
 118    left: 0;
 119    right: 0;
 120    margin: auto;
 121    background: #555d66; }
 122  
 123  .components-autocomplete__popover .components-popover__content {
 124    min-width: 200px; }
 125  
 126  .components-autocomplete__popover .components-autocomplete__results {
 127    padding: 3px;
 128    display: flex;
 129    flex-direction: column;
 130    align-items: stretch; }
 131    .components-autocomplete__popover .components-autocomplete__results:empty {
 132      display: none; }
 133  
 134  .components-autocomplete__result.components-button {
 135    margin-bottom: 0;
 136    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 137    font-size: 13px;
 138    color: #555d66;
 139    display: flex;
 140    flex-direction: row;
 141    flex-grow: 1;
 142    flex-shrink: 0;
 143    align-items: center;
 144    padding: 6px 8px;
 145    margin-left: -3px;
 146    margin-right: -3px;
 147    text-align: left; }
 148    .components-autocomplete__result.components-button.is-selected {
 149      color: #191e23;
 150      border: none;
 151      box-shadow: none;
 152      outline-offset: -2px;
 153      outline: 1px dotted #555d66; }
 154    .components-autocomplete__result.components-button:hover {
 155      color: #191e23;
 156      border: none;
 157      box-shadow: none;
 158      background: #f3f4f5; }
 159  
 160  .components-base-control {
 161    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 162    font-size: 13px; }
 163    .components-base-control .components-base-control__field {
 164      margin-bottom: 8px; }
 165      .components-panel__row .components-base-control .components-base-control__field {
 166        margin-bottom: inherit; }
 167    .components-base-control .components-base-control__label {
 168      display: inline-block;
 169      margin-bottom: 4px; }
 170    .components-base-control .components-base-control__help {
 171      margin-top: -8px;
 172      font-style: italic; }
 173  
 174  .components-base-control + .components-base-control {
 175    margin-bottom: 16px; }
 176  
 177  .components-button-group {
 178    display: inline-block; }
 179    .components-button-group .components-button {
 180      border-radius: 0;
 181      display: inline-flex; }
 182      .components-button-group .components-button + .components-button {
 183        margin-left: -1px; }
 184      .components-button-group .components-button:first-child {
 185        border-radius: 3px 0 0 3px; }
 186      .components-button-group .components-button:last-child {
 187        border-radius: 0 3px 3px 0; }
 188      .components-button-group .components-button:focus, .components-button-group .components-button.is-primary {
 189        position: relative;
 190        z-index: 1; }
 191      .components-button-group .components-button.is-primary {
 192        box-shadow: none; }
 193  
 194  .components-button {
 195    display: inline-flex;
 196    text-decoration: none;
 197    font-size: 13px;
 198    margin: 0;
 199    border: 0;
 200    cursor: pointer;
 201    -webkit-appearance: none;
 202    background: none;
 203    transition: box-shadow 0.1s linear;
 204    height: 36px;
 205    align-items: center;
 206    box-sizing: border-box;
 207    padding: 0 8px;
 208    overflow: hidden;
 209    border-radius: 3px;
 210    color: #555d66;
 211    /* Buttons that look like links, for a cross of good semantics with the visual */
 212    /* Link buttons that are red to indicate destructive behavior. */ }
 213    @media (prefers-reduced-motion: reduce) {
 214      .components-button {
 215        transition-duration: 0s; } }
 216    .components-button:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):not(.is-primary):not(.is-tertiary):not(.is-link):hover {
 217      background-color: #fff;
 218      color: #191e23;
 219      box-shadow: inset 0 0 0 1px #555d66, inset 0 0 0 2px #fff; }
 220    .components-button.is-secondary {
 221      border-width: 1px;
 222      border-style: solid;
 223      white-space: nowrap;
 224      color: rgb(0, 117, 175);
 225      border-color: rgb(0, 117, 175);
 226      background: #f3f5f6; }
 227    body.admin-color-sunrise .components-button.is-secondary {
 228      color: rgb(196, 126, 70);
 229      border-color: rgb(196, 126, 70); }
 230    body.admin-color-ocean .components-button.is-secondary {
 231      color: rgb(153, 174, 152);
 232      border-color: rgb(153, 174, 152); }
 233    body.admin-color-midnight .components-button.is-secondary {
 234      color: rgb(212, 72, 63);
 235      border-color: rgb(212, 72, 63); }
 236    body.admin-color-ectoplasm .components-button.is-secondary {
 237      color: rgb(157, 171, 81);
 238      border-color: rgb(157, 171, 81); }
 239    body.admin-color-coffee .components-button.is-secondary {
 240      color: rgb(182, 156, 132);
 241      border-color: rgb(182, 156, 132); }
 242    body.admin-color-blue .components-button.is-secondary {
 243      color: rgb(204, 161, 84);
 244      border-color: rgb(204, 161, 84); }
 245    body.admin-color-light .components-button.is-secondary {
 246      color: rgb(0, 125, 175);
 247      border-color: rgb(0, 125, 175); }
 248      .components-button.is-secondary:not(:disabled):not([aria-disabled="true"]):hover {
 249        background: #f1f1f1;
 250        border-color: rgb(0, 93, 140);
 251        color: rgb(0, 93, 140);
 252        text-decoration: none; }
 253      body.admin-color-sunrise .components-button.is-secondary:not(:disabled):not([aria-disabled="true"]):hover {
 254        border-color: rgb(157, 101, 56);
 255        color: rgb(157, 101, 56); }
 256      body.admin-color-ocean .components-button.is-secondary:not(:disabled):not([aria-disabled="true"]):hover {
 257        border-color: rgb(122, 139, 122);
 258        color: rgb(122, 139, 122); }
 259      body.admin-color-midnight .components-button.is-secondary:not(:disabled):not([aria-disabled="true"]):hover {
 260        border-color: rgb(169, 58, 50);
 261        color: rgb(169, 58, 50); }
 262      body.admin-color-ectoplasm .components-button.is-secondary:not(:disabled):not([aria-disabled="true"]):hover {
 263        border-color: rgb(125, 137, 65);
 264        color: rgb(125, 137, 65); }
 265      body.admin-color-coffee .components-button.is-secondary:not(:disabled):not([aria-disabled="true"]):hover {
 266        border-color: rgb(146, 125, 105);
 267        color: rgb(146, 125, 105); }
 268      body.admin-color-blue .components-button.is-secondary:not(:disabled):not([aria-disabled="true"]):hover {
 269        border-color: rgb(163, 128, 67);
 270        color: rgb(163, 128, 67); }
 271      body.admin-color-light .components-button.is-secondary:not(:disabled):not([aria-disabled="true"]):hover {
 272        border-color: rgb(0, 100, 140);
 273        color: rgb(0, 100, 140); }
 274      .components-button.is-secondary:focus:enabled {
 275        background: #f3f5f6;
 276        color: rgb(0, 93, 140);
 277        border-color: rgb(0, 118, 177);
 278        box-shadow: 0 0 0 1px rgb(0, 118, 177);
 279        text-decoration: none; }
 280      body.admin-color-sunrise .components-button.is-secondary:focus:enabled {
 281        color: rgb(157, 101, 56);
 282        border-color: rgb(199, 127, 70);
 283        box-shadow: 0 0 0 1px rgb(199, 127, 70); }
 284      body.admin-color-ocean .components-button.is-secondary:focus:enabled {
 285        color: rgb(122, 139, 122);
 286        border-color: rgb(155, 176, 154);
 287        box-shadow: 0 0 0 1px rgb(155, 176, 154); }
 288      body.admin-color-midnight .components-button.is-secondary:focus:enabled {
 289        color: rgb(169, 58, 50);
 290        border-color: rgb(214, 73, 64);
 291        box-shadow: 0 0 0 1px rgb(214, 73, 64); }
 292      body.admin-color-ectoplasm .components-button.is-secondary:focus:enabled {
 293        color: rgb(125, 137, 65);
 294        border-color: rgb(159, 173, 82);
 295        box-shadow: 0 0 0 1px rgb(159, 173, 82); }
 296      body.admin-color-coffee .components-button.is-secondary:focus:enabled {
 297        color: rgb(146, 125, 105);
 298        border-color: rgb(184, 158, 133);
 299        box-shadow: 0 0 0 1px rgb(184, 158, 133); }
 300      body.admin-color-blue .components-button.is-secondary:focus:enabled {
 301        color: rgb(163, 128, 67);
 302        border-color: rgb(206, 162, 85);
 303        box-shadow: 0 0 0 1px rgb(206, 162, 85); }
 304      body.admin-color-light .components-button.is-secondary:focus:enabled {
 305        color: rgb(0, 100, 140);
 306        border-color: rgb(0, 126, 177);
 307        box-shadow: 0 0 0 1px rgb(0, 126, 177); }
 308      .components-button.is-secondary:not([aria-disabled="true"]):active:enabled {
 309        background: #f3f5f6;
 310        color: rgb(0, 118, 177);
 311        border-color: #7e8993;
 312        box-shadow: none; }
 313      body.admin-color-sunrise .components-button.is-secondary:not([aria-disabled="true"]):active:enabled {
 314        color: rgb(199, 127, 70); }
 315      body.admin-color-ocean .components-button.is-secondary:not([aria-disabled="true"]):active:enabled {
 316        color: rgb(155, 176, 154); }
 317      body.admin-color-midnight .components-button.is-secondary:not([aria-disabled="true"]):active:enabled {
 318        color: rgb(214, 73, 64); }
 319      body.admin-color-ectoplasm .components-button.is-secondary:not([aria-disabled="true"]):active:enabled {
 320        color: rgb(159, 173, 82); }
 321      body.admin-color-coffee .components-button.is-secondary:not([aria-disabled="true"]):active:enabled {
 322        color: rgb(184, 158, 133); }
 323      body.admin-color-blue .components-button.is-secondary:not([aria-disabled="true"]):active:enabled {
 324        color: rgb(206, 162, 85); }
 325      body.admin-color-light .components-button.is-secondary:not([aria-disabled="true"]):active:enabled {
 326        color: rgb(0, 126, 177); }
 327      .components-button.is-secondary:disabled, .components-button.is-secondary[aria-disabled="true"] {
 328        color: #a0a5aa;
 329        border-color: #ddd;
 330        background: #f7f7f7;
 331        text-shadow: 0 1px 0 #fff;
 332        transform: none;
 333        opacity: 1; }
 334    .components-button.is-primary {
 335      border-width: 1px;
 336      border-style: solid;
 337      white-space: nowrap;
 338      background: rgb(0, 124, 186);
 339      border-color: rgb(0, 124, 186);
 340      color: #fff;
 341      text-decoration: none;
 342      text-shadow: none; }
 343    body.admin-color-sunrise .components-button.is-primary {
 344      background: rgb(209, 134, 74);
 345      border-color: rgb(209, 134, 74); }
 346    body.admin-color-ocean .components-button.is-primary {
 347      background: rgb(163, 185, 162);
 348      border-color: rgb(163, 185, 162); }
 349    body.admin-color-midnight .components-button.is-primary {
 350      background: rgb(225, 77, 67);
 351      border-color: rgb(225, 77, 67); }
 352    body.admin-color-ectoplasm .components-button.is-primary {
 353      background: rgb(167, 182, 86);
 354      border-color: rgb(167, 182, 86); }
 355    body.admin-color-coffee .components-button.is-primary {
 356      background: rgb(194, 166, 140);
 357      border-color: rgb(194, 166, 140); }
 358    body.admin-color-blue .components-button.is-primary {
 359      background: rgb(217, 171, 89);
 360      border-color: rgb(217, 171, 89); }
 361    body.admin-color-light .components-button.is-primary {
 362      background: rgb(0, 133, 186);
 363      border-color: rgb(0, 133, 186); }
 364      .components-button.is-primary:not(:disabled):not([aria-disabled="true"]):hover, .components-button.is-primary:focus:enabled {
 365        background: rgb(0, 112, 167);
 366        border-color: rgb(0, 112, 167);
 367        color: #fff; }
 368      body.admin-color-sunrise .components-button.is-primary:not(:disabled):not([aria-disabled="true"]):hover, body.admin-color-sunrise .components-button.is-primary:focus:enabled {
 369        background: rgb(188, 121, 67);
 370        border-color: rgb(188, 121, 67); }
 371      body.admin-color-ocean .components-button.is-primary:not(:disabled):not([aria-disabled="true"]):hover, body.admin-color-ocean .components-button.is-primary:focus:enabled {
 372        background: rgb(147, 167, 146);
 373        border-color: rgb(147, 167, 146); }
 374      body.admin-color-midnight .components-button.is-primary:not(:disabled):not([aria-disabled="true"]):hover, body.admin-color-midnight .components-button.is-primary:focus:enabled {
 375        background: rgb(203, 69, 60);
 376        border-color: rgb(203, 69, 60); }
 377      body.admin-color-ectoplasm .components-button.is-primary:not(:disabled):not([aria-disabled="true"]):hover, body.admin-color-ectoplasm .components-button.is-primary:focus:enabled {
 378        background: rgb(150, 164, 77);
 379        border-color: rgb(150, 164, 77); }
 380      body.admin-color-coffee .components-button.is-primary:not(:disabled):not([aria-disabled="true"]):hover, body.admin-color-coffee .components-button.is-primary:focus:enabled {
 381        background: rgb(175, 149, 126);
 382        border-color: rgb(175, 149, 126); }
 383      body.admin-color-blue .components-button.is-primary:not(:disabled):not([aria-disabled="true"]):hover, body.admin-color-blue .components-button.is-primary:focus:enabled {
 384        background: rgb(195, 154, 80);
 385        border-color: rgb(195, 154, 80); }
 386      body.admin-color-light .components-button.is-primary:not(:disabled):not([aria-disabled="true"]):hover, body.admin-color-light .components-button.is-primary:focus:enabled {
 387        background: rgb(0, 120, 167);
 388        border-color: rgb(0, 120, 167); }
 389      .components-button.is-primary:focus:enabled {
 390        box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(0, 124, 186); }
 391      body.admin-color-sunrise .components-button.is-primary:focus:enabled {
 392        box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(209, 134, 74); }
 393      body.admin-color-ocean .components-button.is-primary:focus:enabled {
 394        box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(163, 185, 162); }
 395      body.admin-color-midnight .components-button.is-primary:focus:enabled {
 396        box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(225, 77, 67); }
 397      body.admin-color-ectoplasm .components-button.is-primary:focus:enabled {
 398        box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(167, 182, 86); }
 399      body.admin-color-coffee .components-button.is-primary:focus:enabled {
 400        box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(194, 166, 140); }
 401      body.admin-color-blue .components-button.is-primary:focus:enabled {
 402        box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(217, 171, 89); }
 403      body.admin-color-light .components-button.is-primary:focus:enabled {
 404        box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(0, 133, 186); }
 405      .components-button.is-primary:not([aria-disabled="true"]):active:enabled {
 406        background: rgb(0, 99, 149);
 407        border-color: rgb(0, 99, 149);
 408        color: #fff; }
 409      body.admin-color-sunrise .components-button.is-primary:not([aria-disabled="true"]):active:enabled {
 410        background: rgb(167, 107, 59);
 411        border-color: rgb(167, 107, 59); }
 412      body.admin-color-ocean .components-button.is-primary:not([aria-disabled="true"]):active:enabled {
 413        background: rgb(130, 148, 130);
 414        border-color: rgb(130, 148, 130); }
 415      body.admin-color-midnight .components-button.is-primary:not([aria-disabled="true"]):active:enabled {
 416        background: rgb(180, 62, 54);
 417        border-color: rgb(180, 62, 54); }
 418      body.admin-color-ectoplasm .components-button.is-primary:not([aria-disabled="true"]):active:enabled {
 419        background: rgb(134, 146, 69);
 420        border-color: rgb(134, 146, 69); }
 421      body.admin-color-coffee .components-button.is-primary:not([aria-disabled="true"]):active:enabled {
 422        background: rgb(155, 133, 112);
 423        border-color: rgb(155, 133, 112); }
 424      body.admin-color-blue .components-button.is-primary:not([aria-disabled="true"]):active:enabled {
 425        background: rgb(174, 137, 71);
 426        border-color: rgb(174, 137, 71); }
 427      body.admin-color-light .components-button.is-primary:not([aria-disabled="true"]):active:enabled {
 428        background: rgb(0, 106, 149);
 429        border-color: rgb(0, 106, 149); }
 430      .components-button.is-primary:disabled, .components-button.is-primary:disabled:active:enabled, .components-button.is-primary[aria-disabled="true"], .components-button.is-primary[aria-disabled="true"]:enabled, .components-button.is-primary[aria-disabled="true"]:active:enabled {
 431        color: rgb(102, 176, 214);
 432        background: rgb(25, 137, 193);
 433        border-color: rgb(25, 137, 193);
 434        opacity: 1; }
 435      body.admin-color-sunrise .components-button.is-primary:disabled, body.admin-color-sunrise .components-button.is-primary:disabled:active:enabled, body.admin-color-sunrise .components-button.is-primary[aria-disabled="true"], body.admin-color-sunrise .components-button.is-primary[aria-disabled="true"]:enabled, body.admin-color-sunrise .components-button.is-primary[aria-disabled="true"]:active:enabled {
 436        color: rgb(227, 182, 146);
 437        background: rgb(214, 146, 92);
 438        border-color: rgb(214, 146, 92); }
 439      body.admin-color-ocean .components-button.is-primary:disabled, body.admin-color-ocean .components-button.is-primary:disabled:active:enabled, body.admin-color-ocean .components-button.is-primary[aria-disabled="true"], body.admin-color-ocean .components-button.is-primary[aria-disabled="true"]:enabled, body.admin-color-ocean .components-button.is-primary[aria-disabled="true"]:active:enabled {
 440        color: rgb(200, 213, 199);
 441        background: rgb(172, 192, 171);
 442        border-color: rgb(172, 192, 171); }
 443      body.admin-color-midnight .components-button.is-primary:disabled, body.admin-color-midnight .components-button.is-primary:disabled:active:enabled, body.admin-color-midnight .components-button.is-primary[aria-disabled="true"], body.admin-color-midnight .components-button.is-primary[aria-disabled="true"]:enabled, body.admin-color-midnight .components-button.is-primary[aria-disabled="true"]:active:enabled {
 444        color: rgb(237, 148, 142);
 445        background: rgb(228, 95, 86);
 446        border-color: rgb(228, 95, 86); }
 447      body.admin-color-ectoplasm .components-button.is-primary:disabled, body.admin-color-ectoplasm .components-button.is-primary:disabled:active:enabled, body.admin-color-ectoplasm .components-button.is-primary[aria-disabled="true"], body.admin-color-ectoplasm .components-button.is-primary[aria-disabled="true"]:enabled, body.admin-color-ectoplasm .components-button.is-primary[aria-disabled="true"]:active:enabled {
 448        color: rgb(202, 211, 154);
 449        background: rgb(176, 189, 103);
 450        border-color: rgb(176, 189, 103); }
 451      body.admin-color-coffee .components-button.is-primary:disabled, body.admin-color-coffee .components-button.is-primary:disabled:active:enabled, body.admin-color-coffee .components-button.is-primary[aria-disabled="true"], body.admin-color-coffee .components-button.is-primary[aria-disabled="true"]:enabled, body.admin-color-coffee .components-button.is-primary[aria-disabled="true"]:active:enabled {
 452        color: rgb(218, 202, 186);
 453        background: rgb(200, 175, 152);
 454        border-color: rgb(200, 175, 152); }
 455      body.admin-color-blue .components-button.is-primary:disabled, body.admin-color-blue .components-button.is-primary:disabled:active:enabled, body.admin-color-blue .components-button.is-primary[aria-disabled="true"], body.admin-color-blue .components-button.is-primary[aria-disabled="true"]:enabled, body.admin-color-blue .components-button.is-primary[aria-disabled="true"]:active:enabled {
 456        color: rgb(232, 205, 155);
 457        background: rgb(221, 179, 106);
 458        border-color: rgb(221, 179, 106); }
 459      body.admin-color-light .components-button.is-primary:disabled, body.admin-color-light .components-button.is-primary:disabled:active:enabled, body.admin-color-light .components-button.is-primary[aria-disabled="true"], body.admin-color-light .components-button.is-primary[aria-disabled="true"]:enabled, body.admin-color-light .components-button.is-primary[aria-disabled="true"]:active:enabled {
 460        color: rgb(102, 182, 214);
 461        background: rgb(25, 145, 193);
 462        border-color: rgb(25, 145, 193); }
 463        .components-button.is-primary:disabled:focus:enabled, .components-button.is-primary:disabled:active:enabled:focus:enabled, .components-button.is-primary[aria-disabled="true"]:focus:enabled, .components-button.is-primary[aria-disabled="true"]:enabled:focus:enabled, .components-button.is-primary[aria-disabled="true"]:active:enabled:focus:enabled {
 464          box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(0, 124, 186); }
 465        body.admin-color-sunrise .components-button.is-primary:disabled:focus:enabled, body.admin-color-sunrise .components-button.is-primary:disabled:active:enabled:focus:enabled, body.admin-color-sunrise .components-button.is-primary[aria-disabled="true"]:focus:enabled, body.admin-color-sunrise .components-button.is-primary[aria-disabled="true"]:enabled:focus:enabled, body.admin-color-sunrise .components-button.is-primary[aria-disabled="true"]:active:enabled:focus:enabled {
 466          box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(209, 134, 74); }
 467        body.admin-color-ocean .components-button.is-primary:disabled:focus:enabled, body.admin-color-ocean .components-button.is-primary:disabled:active:enabled:focus:enabled, body.admin-color-ocean .components-button.is-primary[aria-disabled="true"]:focus:enabled, body.admin-color-ocean .components-button.is-primary[aria-disabled="true"]:enabled:focus:enabled, body.admin-color-ocean .components-button.is-primary[aria-disabled="true"]:active:enabled:focus:enabled {
 468          box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(163, 185, 162); }
 469        body.admin-color-midnight .components-button.is-primary:disabled:focus:enabled, body.admin-color-midnight .components-button.is-primary:disabled:active:enabled:focus:enabled, body.admin-color-midnight .components-button.is-primary[aria-disabled="true"]:focus:enabled, body.admin-color-midnight .components-button.is-primary[aria-disabled="true"]:enabled:focus:enabled, body.admin-color-midnight .components-button.is-primary[aria-disabled="true"]:active:enabled:focus:enabled {
 470          box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(225, 77, 67); }
 471        body.admin-color-ectoplasm .components-button.is-primary:disabled:focus:enabled, body.admin-color-ectoplasm .components-button.is-primary:disabled:active:enabled:focus:enabled, body.admin-color-ectoplasm .components-button.is-primary[aria-disabled="true"]:focus:enabled, body.admin-color-ectoplasm .components-button.is-primary[aria-disabled="true"]:enabled:focus:enabled, body.admin-color-ectoplasm .components-button.is-primary[aria-disabled="true"]:active:enabled:focus:enabled {
 472          box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(167, 182, 86); }
 473        body.admin-color-coffee .components-button.is-primary:disabled:focus:enabled, body.admin-color-coffee .components-button.is-primary:disabled:active:enabled:focus:enabled, body.admin-color-coffee .components-button.is-primary[aria-disabled="true"]:focus:enabled, body.admin-color-coffee .components-button.is-primary[aria-disabled="true"]:enabled:focus:enabled, body.admin-color-coffee .components-button.is-primary[aria-disabled="true"]:active:enabled:focus:enabled {
 474          box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(194, 166, 140); }
 475        body.admin-color-blue .components-button.is-primary:disabled:focus:enabled, body.admin-color-blue .components-button.is-primary:disabled:active:enabled:focus:enabled, body.admin-color-blue .components-button.is-primary[aria-disabled="true"]:focus:enabled, body.admin-color-blue .components-button.is-primary[aria-disabled="true"]:enabled:focus:enabled, body.admin-color-blue .components-button.is-primary[aria-disabled="true"]:active:enabled:focus:enabled {
 476          box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(217, 171, 89); }
 477        body.admin-color-light .components-button.is-primary:disabled:focus:enabled, body.admin-color-light .components-button.is-primary:disabled:active:enabled:focus:enabled, body.admin-color-light .components-button.is-primary[aria-disabled="true"]:focus:enabled, body.admin-color-light .components-button.is-primary[aria-disabled="true"]:enabled:focus:enabled, body.admin-color-light .components-button.is-primary[aria-disabled="true"]:active:enabled:focus:enabled {
 478          box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgb(0, 133, 186); }
 479      .components-button.is-primary.is-busy, .components-button.is-primary.is-busy:disabled, .components-button.is-primary.is-busy[aria-disabled="true"] {
 480        color: #fff;
 481        background-size: 100px 100%;
 482        /* stylelint-disable */
 483        background-image: linear-gradient(-45deg, #007cba 28%, rgb(0, 99, 149) 28%, rgb(0, 99, 149) 72%, #007cba 72%);
 484        /* stylelint-enable */
 485        border-color: rgb(0, 124, 186); }
 486      body.admin-color-sunrise .components-button.is-primary.is-busy, body.admin-color-sunrise .components-button.is-primary.is-busy:disabled, body.admin-color-sunrise .components-button.is-primary.is-busy[aria-disabled="true"] {
 487        background-image: linear-gradient(-45deg, #d1864a 28%, rgb(167, 107, 59) 28%, rgb(167, 107, 59) 72%, #d1864a 72%);
 488        border-color: rgb(209, 134, 74); }
 489      body.admin-color-ocean .components-button.is-primary.is-busy, body.admin-color-ocean .components-button.is-primary.is-busy:disabled, body.admin-color-ocean .components-button.is-primary.is-busy[aria-disabled="true"] {
 490        background-image: linear-gradient(-45deg, #a3b9a2 28%, rgb(130, 148, 130) 28%, rgb(130, 148, 130) 72%, #a3b9a2 72%);
 491        border-color: rgb(163, 185, 162); }
 492      body.admin-color-midnight .components-button.is-primary.is-busy, body.admin-color-midnight .components-button.is-primary.is-busy:disabled, body.admin-color-midnight .components-button.is-primary.is-busy[aria-disabled="true"] {
 493        background-image: linear-gradient(-45deg, #e14d43 28%, rgb(180, 62, 54) 28%, rgb(180, 62, 54) 72%, #e14d43 72%);
 494        border-color: rgb(225, 77, 67); }
 495      body.admin-color-ectoplasm .components-button.is-primary.is-busy, body.admin-color-ectoplasm .components-button.is-primary.is-busy:disabled, body.admin-color-ectoplasm .components-button.is-primary.is-busy[aria-disabled="true"] {
 496        background-image: linear-gradient(-45deg, #a7b656 28%, rgb(134, 146, 69) 28%, rgb(134, 146, 69) 72%, #a7b656 72%);
 497        border-color: rgb(167, 182, 86); }
 498      body.admin-color-coffee .components-button.is-primary.is-busy, body.admin-color-coffee .components-button.is-primary.is-busy:disabled, body.admin-color-coffee .components-button.is-primary.is-busy[aria-disabled="true"] {
 499        background-image: linear-gradient(-45deg, #c2a68c 28%, rgb(155, 133, 112) 28%, rgb(155, 133, 112) 72%, #c2a68c 72%);
 500        border-color: rgb(194, 166, 140); }
 501      body.admin-color-blue .components-button.is-primary.is-busy, body.admin-color-blue .components-button.is-primary.is-busy:disabled, body.admin-color-blue .components-button.is-primary.is-busy[aria-disabled="true"] {
 502        background-image: linear-gradient(-45deg, #d9ab59 28%, rgb(174, 137, 71) 28%, rgb(174, 137, 71) 72%, #d9ab59 72%);
 503        border-color: rgb(217, 171, 89); }
 504      body.admin-color-light .components-button.is-primary.is-busy, body.admin-color-light .components-button.is-primary.is-busy:disabled, body.admin-color-light .components-button.is-primary.is-busy[aria-disabled="true"] {
 505        background-image: linear-gradient(-45deg, #0085ba 28%, rgb(0, 106, 149) 28%, rgb(0, 106, 149) 72%, #0085ba 72%);
 506        border-color: rgb(0, 133, 186); }
 507    .components-button.is-link {
 508      margin: 0;
 509      padding: 0;
 510      box-shadow: none;
 511      border: 0;
 512      border-radius: 0;
 513      background: none;
 514      outline: none;
 515      text-align: left;
 516      /* Mimics the default link style in common.css */
 517      color: #0073aa;
 518      text-decoration: underline;
 519      transition-property: border, background, color;
 520      transition-duration: 0.05s;
 521      transition-timing-function: ease-in-out;
 522      height: auto; }
 523      @media (prefers-reduced-motion: reduce) {
 524        .components-button.is-link {
 525          transition-duration: 0s; } }
 526      .components-button.is-link:not(:disabled):not([aria-disabled="true"]):hover, .components-button.is-link:not([aria-disabled="true"]):active {
 527        color: #00a0d2; }
 528      .components-button.is-link:focus {
 529        color: #124964;
 530        box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8); }
 531    .components-button.is-link.is-destructive {
 532      color: #d94f4f; }
 533    .components-button:not([aria-disabled="true"]):active {
 534      color: inherit; }
 535    .components-button:disabled, .components-button[aria-disabled="true"] {
 536      cursor: default;
 537      opacity: 0.3; }
 538    .components-button:focus:not(:disabled) {
 539      background-color: #fff;
 540      color: #191e23;
 541      box-shadow: inset 0 0 0 1px #6c7781, inset 0 0 0 2px #fff;
 542      outline: 2px solid transparent; }
 543    .components-button.is-busy, .components-button.is-secondary.is-busy, .components-button.is-secondary.is-busy:disabled, .components-button.is-secondary.is-busy[aria-disabled="true"] {
 544      animation: components-button__busy-animation 2500ms infinite linear;
 545      background-size: 100px 100%;
 546      background-image: repeating-linear-gradient(-45deg, #e2e4e7, #fff 11px, #fff 10px, #e2e4e7 20px);
 547      opacity: 1; }
 548    .components-button.is-small {
 549      height: 24px;
 550      line-height: 22px;
 551      padding: 0 8px;
 552      font-size: 11px; }
 553    .components-button.is-tertiary {
 554      color: #007cba; }
 555    body.admin-color-sunrise .components-button.is-tertiary {
 556      color: #837425; }
 557    body.admin-color-ocean .components-button.is-tertiary {
 558      color: #5e7d5e; }
 559    body.admin-color-midnight .components-button.is-tertiary {
 560      color: #497b8d; }
 561    body.admin-color-ectoplasm .components-button.is-tertiary {
 562      color: #523f6d; }
 563    body.admin-color-coffee .components-button.is-tertiary {
 564      color: #59524c; }
 565    body.admin-color-blue .components-button.is-tertiary {
 566      color: #417e9B; }
 567    body.admin-color-light .components-button.is-tertiary {
 568      color: #007cba; }
 569      .components-button.is-tertiary .dashicon {
 570        display: inline-block;
 571        flex: 0 0 auto; }
 572      .components-button.is-tertiary:not([aria-disabled="true"]):active:focus:enabled {
 573        box-shadow: none; }
 574      .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):hover {
 575        color: rgb(0, 93, 140); }
 576      body.admin-color-sunrise .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):hover {
 577        color: rgb(98, 87, 28); }
 578      body.admin-color-ocean .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):hover {
 579        color: rgb(71, 94, 71); }
 580      body.admin-color-midnight .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):hover {
 581        color: rgb(55, 92, 106); }
 582      body.admin-color-ectoplasm .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):hover {
 583        color: rgb(62, 47, 82); }
 584      body.admin-color-coffee .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):hover {
 585        color: rgb(67, 62, 57); }
 586      body.admin-color-blue .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):hover {
 587        color: rgb(49, 95, 116); }
 588      body.admin-color-light .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):hover {
 589        color: rgb(0, 93, 140); }
 590    .components-button.has-icon .dashicon {
 591      display: inline-block;
 592      flex: 0 0 auto; }
 593    .components-button.has-icon.has-text svg {
 594      margin-right: 8px; }
 595    .components-button svg {
 596      fill: currentColor;
 597      outline: none; }
 598    .components-button .screen-reader-text {
 599      height: auto; }
 600  
 601  @keyframes components-button__busy-animation {
 602    0% {
 603      background-position: 200px 0; } }
 604  
 605  .components-checkbox-control__input[type="checkbox"] {
 606    border: 1px solid #b4b9be;
 607    background: #fff;
 608    color: #555;
 609    clear: none;
 610    cursor: pointer;
 611    display: inline-block;
 612    line-height: 0;
 613    margin: 0 4px 0 0;
 614    outline: 0;
 615    padding: 0 !important;
 616    text-align: center;
 617    vertical-align: top;
 618    width: 25px;
 619    height: 25px;
 620    -webkit-appearance: none;
 621    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
 622    transition: 0.05s border-color ease-in-out; }
 623    @media (min-width: 600px) {
 624      .components-checkbox-control__input[type="checkbox"] {
 625        height: 16px;
 626        width: 16px; } }
 627    .components-checkbox-control__input[type="checkbox"]:focus {
 628      border-color: #5b9dd9;
 629      box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
 630      outline: 2px solid transparent; }
 631    .components-checkbox-control__input[type="checkbox"]:checked {
 632      background: #11a0d2;
 633      border-color: #11a0d2; }
 634      .components-checkbox-control__input[type="checkbox"]:checked::-ms-check {
 635        opacity: 0; }
 636    .components-checkbox-control__input[type="checkbox"]:focus:checked {
 637      border: none; }
 638    .components-checkbox-control__input[type="checkbox"]:checked::before {
 639      content: none; }
 640  
 641  .components-checkbox-control__input-container {
 642    position: relative;
 643    display: inline-block;
 644    margin-right: 12px;
 645    vertical-align: middle;
 646    width: 25px;
 647    height: 25px; }
 648    @media (min-width: 600px) {
 649      .components-checkbox-control__input-container {
 650        width: 16px;
 651        height: 16px; } }
 652  
 653  svg.components-checkbox-control__checked {
 654    fill: #fff;
 655    cursor: pointer;
 656    position: absolute;
 657    left: -4px;
 658    top: -2px;
 659    width: 31px;
 660    height: 31px;
 661    -webkit-user-select: none;
 662        -ms-user-select: none;
 663            user-select: none;
 664    pointer-events: none; }
 665    @media (min-width: 600px) {
 666      svg.components-checkbox-control__checked {
 667        width: 21px;
 668        height: 21px;
 669        left: -3px; } }
 670  
 671  .components-circular-option-picker {
 672    display: inline-block;
 673    margin-top: 0.6rem;
 674    width: 100%; }
 675    .components-circular-option-picker .components-circular-option-picker__custom-clear-wrapper {
 676      display: flex;
 677      justify-content: flex-end; }
 678  
 679  .components-circular-option-picker__option-wrapper {
 680    display: inline-block;
 681    height: 28px;
 682    width: 28px;
 683    margin-right: 12px;
 684    margin-bottom: 12px;
 685    vertical-align: top;
 686    transform: scale(1);
 687    transition: 100ms transform ease; }
 688    @media (prefers-reduced-motion: reduce) {
 689      .components-circular-option-picker__option-wrapper {
 690        transition-duration: 0s; } }
 691    .components-circular-option-picker__option-wrapper:hover {
 692      transform: scale(1.2); }
 693    .components-circular-option-picker__option-wrapper > div {
 694      height: 100%;
 695      width: 100%; }
 696  
 697  .components-circular-option-picker__option-wrapper::before {
 698    content: "";
 699    position: absolute;
 700    top: 1px;
 701    left: 1px;
 702    bottom: 1px;
 703    right: 1px;
 704    border-radius: 50%;
 705    z-index: -1;
 706    /* stylelint-disable-next-line function-url-quotes */
 707    background: url('data:image/svg+xml,%3Csvg width="28" height="28" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M6 8V6H4v2h2zM8 8V6h2v2H8zM10 16H8v-2h2v2zM12 16v-2h2v2h-2zM12 18v-2h-2v2H8v2h2v-2h2zM14 18v2h-2v-2h2zM16 18h-2v-2h2v2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M18 18h2v-2h-2v-2h2v-2h-2v-2h2V8h-2v2h-2V8h-2v2h2v2h-2v2h2v2h2v2zm-2-4v-2h2v2h-2z" fill="%23555D65"/%3E%3Cpath d="M18 18v2h-2v-2h2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M8 10V8H6v2H4v2h2v2H4v2h2v2H4v2h2v2H4v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2v2h-2V4h-2v2h-2V4h-2v2h-2V4h-2v2h2v2h-2v2H8zm0 2v-2H6v2h2zm2 0v-2h2v2h-2zm0 2v-2H8v2H6v2h2v2H6v2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h-2v2h-2V6h-2v2h-2v2h2v2h-2v2h-2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M4 0H2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2V2h2V0h-2v2h-2V0h-2v2h-2V0h-2v2h-2V0h-2v2h-2V0h-2v2H8V0H6v2H4V0zm0 4V2H2v2h2zm2 0V2h2v2H6zm0 2V4H4v2H2v2h2v2H2v2h2v2H2v2h2v2H2v2h2v2H2v2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2V2h-2v2h-2V2h-2v2h-2V2h-2v2h-2V2h-2v2H8v2H6z" fill="%23555D65"/%3E%3C/svg%3E'); }
 708  
 709  .components-circular-option-picker__option {
 710    display: inline-block;
 711    vertical-align: top;
 712    height: 100%;
 713    width: 100%;
 714    border: none;
 715    border-radius: 50%;
 716    background: transparent;
 717    box-shadow: inset 0 0 0 14px;
 718    transition: 100ms box-shadow ease;
 719    cursor: pointer; }
 720    @media (prefers-reduced-motion: reduce) {
 721      .components-circular-option-picker__option {
 722        transition-duration: 0s; } }
 723    .components-circular-option-picker__option:hover {
 724      box-shadow: inset 0 0 0 14px !important; }
 725    .components-circular-option-picker__option.is-pressed {
 726      box-shadow: inset 0 0 0 4px;
 727      position: relative;
 728      z-index: 1; }
 729      .components-circular-option-picker__option.is-pressed + svg {
 730        position: absolute;
 731        left: 2px;
 732        top: 2px;
 733        border-radius: 50%;
 734        z-index: 2;
 735        background: #fff;
 736        pointer-events: none; }
 737    .components-circular-option-picker__option::after {
 738      content: "";
 739      position: absolute;
 740      top: -1px;
 741      left: -1px;
 742      bottom: -1px;
 743      right: -1px;
 744      border-radius: 50%;
 745      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
 746      border: 1px solid transparent; }
 747    .components-circular-option-picker__option:focus::after {
 748      content: "";
 749      border: 2px solid #606a73;
 750      width: 32px;
 751      height: 32px;
 752      position: absolute;
 753      top: -2px;
 754      left: -2px;
 755      border-radius: 50%;
 756      box-shadow: inset 0 0 0 2px #fff; }
 757    .components-circular-option-picker__option.components-button:focus {
 758      background-color: transparent;
 759      box-shadow: inset 0 0 0 14px;
 760      outline: none; }
 761  
 762  .components-circular-option-picker__button-action .components-circular-option-picker__option {
 763    color: #fff;
 764    background: #fff; }
 765  
 766  .components-circular-option-picker__dropdown-link-action {
 767    margin-right: 16px; }
 768    .components-circular-option-picker__dropdown-link-action .components-button {
 769      line-height: 22px; }
 770  
 771  .component-color-indicator {
 772    width: 25px;
 773    height: 16px;
 774    margin-left: 0.8rem;
 775    border: 1px solid #dadada;
 776    display: inline-block; }
 777    .component-color-indicator + .component-color-indicator {
 778      margin-left: 0.5rem; }
 779  
 780  /**
 781   * Parts of this source were derived and modified from react-color,
 782   * released under the MIT license.
 783   *
 784   * https://github.com/casesandberg/react-color/
 785   *
 786   * Copyright (c) 2015 Case Sandberg
 787   *
 788   * Permission is hereby granted, free of charge, to any person obtaining a copy
 789   * of this software and associated documentation files (the "Software"), to deal
 790   * in the Software without restriction, including without limitation the rights
 791   * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 792   * copies of the Software, and to permit persons to whom the Software is
 793   * furnished to do so, subject to the following conditions:
 794   *
 795   * The above copyright notice and this permission notice shall be included in
 796   * all copies or substantial portions of the Software.
 797   *
 798   * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 799   * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 800   * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 801   * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 802   * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 803   * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 804   * THE SOFTWARE.
 805   */
 806  .components-color-picker {
 807    width: 100%;
 808    overflow: hidden; }
 809    .components-color-picker * {
 810      box-sizing: border-box; }
 811  
 812  .components-color-picker__saturation {
 813    width: 100%;
 814    padding-bottom: 55%;
 815    position: relative; }
 816  
 817  .components-color-picker__body {
 818    padding: 16px 16px 12px; }
 819  
 820  .components-color-picker__controls {
 821    display: flex; }
 822  
 823  .components-color-picker__saturation-pointer,
 824  .components-color-picker__hue-pointer,
 825  .components-color-picker__alpha-pointer {
 826    padding: 0;
 827    position: absolute;
 828    cursor: pointer;
 829    box-shadow: none;
 830    border: none; }
 831  
 832  /* CURRENT COLOR COMPONENT */
 833  .components-color-picker__swatch {
 834    margin-right: 8px;
 835    width: 32px;
 836    height: 32px;
 837    border-radius: 50%;
 838    position: relative;
 839    overflow: hidden;
 840    background-image: linear-gradient(45deg, #ddd 25%, transparent 25%), linear-gradient(-45deg, #ddd 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #ddd 75%), linear-gradient(-45deg, transparent 75%, #ddd 75%);
 841    background-size: 10px 10px;
 842    background-position: 0 0, 0 5px, 5px -5px, -5px 0; }
 843    .is-alpha-disabled .components-color-picker__swatch {
 844      width: 12px;
 845      height: 12px;
 846      margin-top: 0; }
 847  
 848  .components-color-picker__active {
 849    position: absolute;
 850    top: 0;
 851    left: 0;
 852    right: 0;
 853    bottom: 0;
 854    border-radius: 50%;
 855    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
 856    z-index: 2; }
 857  
 858  /* SATURATION COMPONENT */
 859  .components-color-picker__saturation-color,
 860  .components-color-picker__saturation-white,
 861  .components-color-picker__saturation-black {
 862    position: absolute;
 863    top: 0;
 864    left: 0;
 865    right: 0;
 866    bottom: 0; }
 867  
 868  .components-color-picker__saturation-color {
 869    overflow: hidden; }
 870  
 871  .components-color-picker__saturation-white {
 872    /*rtl:ignore*/
 873    background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0)); }
 874  
 875  .components-color-picker__saturation-black {
 876    background: linear-gradient(to top, #000, rgba(0, 0, 0, 0)); }
 877  
 878  .components-color-picker__saturation-pointer {
 879    width: 14px;
 880    height: 14px;
 881    padding: 0;
 882    box-shadow: 0 0 0 1.5px #fff, inset 0 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px 2px rgba(0, 0, 0, 0.4);
 883    border-radius: 50%;
 884    background-color: transparent;
 885    transform: translate(-4px, -4px); }
 886  
 887  /* HUE & ALPHA BARS */
 888  .components-color-picker__toggles {
 889    flex: 1; }
 890  
 891  .components-color-picker__alpha {
 892    background-image: linear-gradient(45deg, #ddd 25%, transparent 25%), linear-gradient(-45deg, #ddd 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #ddd 75%), linear-gradient(-45deg, transparent 75%, #ddd 75%);
 893    background-size: 10px 10px;
 894    background-position: 0 0, 0 5px, 5px -5px, -5px 0; }
 895  
 896  .components-color-picker__hue-gradient,
 897  .components-color-picker__alpha-gradient {
 898    position: absolute;
 899    top: 0;
 900    left: 0;
 901    right: 0;
 902    bottom: 0; }
 903  
 904  .components-color-picker__hue,
 905  .components-color-picker__alpha {
 906    height: 12px;
 907    position: relative; }
 908  
 909  .is-alpha-enabled .components-color-picker__hue {
 910    margin-bottom: 8px; }
 911  
 912  .components-color-picker__hue-bar,
 913  .components-color-picker__alpha-bar {
 914    position: relative;
 915    margin: 0 3px;
 916    height: 100%;
 917    padding: 0 2px; }
 918  
 919  .components-color-picker__hue-gradient {
 920    /*rtl:ignore*/
 921    background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%); }
 922  
 923  .components-color-picker__hue-pointer,
 924  .components-color-picker__alpha-pointer {
 925    /*rtl:ignore*/
 926    left: 0;
 927    width: 14px;
 928    height: 14px;
 929    border-radius: 50%;
 930    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37);
 931    background: #fff;
 932    transform: translate(-7px, -1px); }
 933  
 934  .components-color-picker__hue-pointer,
 935  .components-color-picker__saturation-pointer {
 936    transition: box-shadow 0.1s linear; }
 937    @media (prefers-reduced-motion: reduce) {
 938      .components-color-picker__hue-pointer,
 939      .components-color-picker__saturation-pointer {
 940        transition-duration: 0s; } }
 941  
 942  .components-color-picker__saturation-pointer:focus {
 943    box-shadow: 0 0 0 2px #fff, 0 0 0 4px #00a0d2, 0 0 5px 0 #00a0d2, inset 0 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px 2px rgba(0, 0, 0, 0.4); }
 944  
 945  .components-color-picker__hue-pointer:focus,
 946  .components-color-picker__alpha-pointer:focus {
 947    border-color: #00a0d2;
 948    box-shadow: 0 0 0 2px #00a0d2, 0 0 3px 0 #00a0d2;
 949    outline: 2px solid transparent;
 950    outline-offset: -2px; }
 951  
 952  /* INPUTS COMPONENT */
 953  .components-color-picker__inputs-wrapper {
 954    margin: 0 -4px;
 955    padding-top: 16px;
 956    display: flex;
 957    align-items: flex-end; }
 958    .components-color-picker__inputs-wrapper fieldset {
 959      flex: 1;
 960      border: none;
 961      margin: 0;
 962      padding: 0; }
 963    .components-color-picker__inputs-wrapper .components-color-picker__inputs-fields .components-text-control__input[type="number"] {
 964      padding: 6px 8px; }
 965  
 966  .components-color-picker__inputs-field {
 967    width: 100%; }
 968  
 969  .components-color-picker__inputs-fields {
 970    display: flex;
 971    /*rtl:ignore*/
 972    direction: ltr;
 973    flex-grow: 1;
 974    margin-right: 4px; }
 975    .components-color-picker__inputs-fields .components-base-control + .components-base-control {
 976      margin-bottom: 0; }
 977    .components-color-picker__inputs-fields .components-base-control__field {
 978      margin: 0 4px; }
 979  
 980  .components-color-picker__inputs-toggle {
 981    height: 30px;
 982    padding: 0 5px; }
 983  
 984  .components-custom-gradient-picker {
 985    margin-top: 8px; }
 986  
 987  .components-custom-gradient-picker__gradient-bar:not(.has-gradient) {
 988    opacity: 0.4; }
 989  
 990  .components-custom-gradient-picker__gradient-bar {
 991    width: 100%;
 992    height: 24px;
 993    border-radius: 24px;
 994    margin-bottom: 16px;
 995    padding-left: 3px;
 996    padding-right: 21px; }
 997    .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__markers-container {
 998      position: relative; }
 999    .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__insert-point {
1000      border-radius: 50%;
1001      background: #fff;
1002      padding: 2px;
1003      min-width: 24px;
1004      width: 24px;
1005      height: 24px;
1006      position: relative; }
1007      .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__insert-point svg {
1008        height: 100%;
1009        width: 100%; }
1010    .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button {
1011      border: 2px solid #fff;
1012      border-radius: 50%;
1013      height: 18px;
1014      padding: 0;
1015      position: absolute;
1016      width: 18px;
1017      top: 3px; }
1018      .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button.is-active {
1019        background: #fafafa;
1020        color: #23282d;
1021        border-color: #999;
1022        box-shadow: 0 0 0 1px #fff, 0 0 0 3px #007cba; }
1023  
1024  .components-custom-gradient-picker__color-picker-popover .components-custom-gradient-picker__remove-control-point {
1025    margin-left: auto;
1026    margin-right: auto;
1027    display: block;
1028    margin-bottom: 8px; }
1029  
1030  .components-custom-gradient-picker__inserter {
1031    width: 100%; }
1032  
1033  .components-custom-gradient-picker__liner-gradient-indicator {
1034    display: inline-block;
1035    flex: 0 auto;
1036    width: 20px;
1037    height: 20px; }
1038  
1039  .components-custom-gradient-picker__ui-line {
1040    display: flex;
1041    justify-content: space-between; }
1042  
1043  .components-custom-gradient-picker .components-custom-gradient-picker__ui-line .components-base-control.components-angle-picker,
1044  .components-custom-gradient-picker .components-custom-gradient-picker__ui-line .components-base-control.components-custom-gradient-picker__type-picker {
1045    margin-bottom: 0; }
1046  
1047  .components-custom-gradient-picker .components-custom-gradient-picker__toolbar {
1048    border: none; }
1049    .components-custom-gradient-picker .components-custom-gradient-picker__toolbar > div + div {
1050      margin-left: 1px; }
1051    .components-custom-gradient-picker .components-custom-gradient-picker__toolbar button.is-pressed > svg {
1052      background: #fff;
1053      border: 1px solid #7e8993;
1054      border-radius: 2px; }
1055  
1056  .components-custom-select-control {
1057    color: #555d66;
1058    position: relative; }
1059  
1060  .components-custom-select-control__label {
1061    display: block;
1062    margin-bottom: 5px; }
1063  
1064  .components-custom-select-control__button {
1065    border: 1px solid #7e8993;
1066    border-radius: 4px;
1067    color: #555d66;
1068    display: inline;
1069    min-height: 30px;
1070    min-width: 130px;
1071    position: relative;
1072    text-align: left; }
1073    .components-custom-select-control__button:focus {
1074      border-color: #00a0d2; }
1075    .components-custom-select-control__button-icon {
1076      height: 100%;
1077      padding: 0 4px;
1078      position: absolute;
1079      right: 0;
1080      top: 0; }
1081  
1082  .components-custom-select-control__menu {
1083    background: #fff;
1084    max-height: 400px;
1085    min-width: 100%;
1086    overflow: auto;
1087    padding: 0;
1088    position: absolute;
1089    z-index: 1000000; }
1090  
1091  .components-custom-select-control__item {
1092    align-items: center;
1093    display: flex;
1094    list-style-type: none;
1095    padding: 10px 5px 10px 25px; }
1096    .components-custom-select-control__item.is-highlighted {
1097      background: #e2e4e7; }
1098    .components-custom-select-control__item-icon {
1099      margin-left: -20px;
1100      margin-right: 0; }
1101  
1102  svg.dashicon {
1103    fill: currentColor;
1104    outline: none; }
1105  
1106  /*rtl:begin:ignore*/
1107  .PresetDateRangePicker_panel {
1108    padding: 0 22px 11px; }
1109  
1110  .PresetDateRangePicker_button {
1111    position: relative;
1112    height: 100%;
1113    text-align: center;
1114    background: 0 0;
1115    border: 2px solid #00a699;
1116    color: #00a699;
1117    padding: 4px 12px;
1118    margin-right: 8px;
1119    font: inherit;
1120    font-weight: 700;
1121    line-height: normal;
1122    overflow: visible;
1123    box-sizing: border-box;
1124    cursor: pointer; }
1125  
1126  .PresetDateRangePicker_button:active {
1127    outline: 0; }
1128  
1129  .PresetDateRangePicker_button__selected {
1130    color: #fff;
1131    background: #00a699; }
1132  
1133  .SingleDatePickerInput {
1134    display: inline-block;
1135    background-color: #fff; }
1136  
1137  .SingleDatePickerInput__withBorder {
1138    border-radius: 2px;
1139    border: 1px solid #dbdbdb; }
1140  
1141  .SingleDatePickerInput__rtl {
1142    direction: rtl; }
1143  
1144  .SingleDatePickerInput__disabled {
1145    background-color: #f2f2f2; }
1146  
1147  .SingleDatePickerInput__block {
1148    display: block; }
1149  
1150  .SingleDatePickerInput__showClearDate {
1151    padding-right: 30px; }
1152  
1153  .SingleDatePickerInput_clearDate {
1154    background: 0 0;
1155    border: 0;
1156    color: inherit;
1157    font: inherit;
1158    line-height: normal;
1159    overflow: visible;
1160    cursor: pointer;
1161    padding: 10px;
1162    margin: 0 10px 0 5px;
1163    position: absolute;
1164    right: 0;
1165    top: 50%;
1166    transform: translateY(-50%); }
1167  
1168  .SingleDatePickerInput_clearDate__default:focus,
1169  .SingleDatePickerInput_clearDate__default:hover {
1170    background: #dbdbdb;
1171    border-radius: 50%; }
1172  
1173  .SingleDatePickerInput_clearDate__small {
1174    padding: 6px; }
1175  
1176  .SingleDatePickerInput_clearDate__hide {
1177    visibility: hidden; }
1178  
1179  .SingleDatePickerInput_clearDate_svg {
1180    fill: #82888a;
1181    height: 12px;
1182    width: 15px;
1183    vertical-align: middle; }
1184  
1185  .SingleDatePickerInput_clearDate_svg__small {
1186    height: 9px; }
1187  
1188  .SingleDatePickerInput_calendarIcon {
1189    background: 0 0;
1190    border: 0;
1191    color: inherit;
1192    font: inherit;
1193    line-height: normal;
1194    overflow: visible;
1195    cursor: pointer;
1196    display: inline-block;
1197    vertical-align: middle;
1198    padding: 10px;
1199    margin: 0 5px 0 10px; }
1200  
1201  .SingleDatePickerInput_calendarIcon_svg {
1202    fill: #82888a;
1203    height: 15px;
1204    width: 14px;
1205    vertical-align: middle; }
1206  
1207  .SingleDatePicker {
1208    position: relative;
1209    display: inline-block; }
1210  
1211  .SingleDatePicker__block {
1212    display: block; }
1213  
1214  .SingleDatePicker_picker {
1215    z-index: 1;
1216    background-color: #fff;
1217    position: absolute; }
1218  
1219  .SingleDatePicker_picker__rtl {
1220    direction: rtl; }
1221  
1222  .SingleDatePicker_picker__directionLeft {
1223    left: 0; }
1224  
1225  .SingleDatePicker_picker__directionRight {
1226    right: 0; }
1227  
1228  .SingleDatePicker_picker__portal {
1229    background-color: rgba(0, 0, 0, 0.3);
1230    position: fixed;
1231    top: 0;
1232    left: 0;
1233    height: 100%;
1234    width: 100%; }
1235  
1236  .SingleDatePicker_picker__fullScreenPortal {
1237    background-color: #fff; }
1238  
1239  .SingleDatePicker_closeButton {
1240    background: 0 0;
1241    border: 0;
1242    color: inherit;
1243    font: inherit;
1244    line-height: normal;
1245    overflow: visible;
1246    cursor: pointer;
1247    position: absolute;
1248    top: 0;
1249    right: 0;
1250    padding: 15px;
1251    z-index: 2; }
1252  
1253  .SingleDatePicker_closeButton:focus,
1254  .SingleDatePicker_closeButton:hover {
1255    color: #b0b3b4;
1256    text-decoration: none; }
1257  
1258  .SingleDatePicker_closeButton_svg {
1259    height: 15px;
1260    width: 15px;
1261    fill: #cacccd; }
1262  
1263  .DayPickerKeyboardShortcuts_buttonReset {
1264    background: 0 0;
1265    border: 0;
1266    border-radius: 0;
1267    color: inherit;
1268    font: inherit;
1269    line-height: normal;
1270    overflow: visible;
1271    padding: 0;
1272    cursor: pointer;
1273    font-size: 14px; }
1274  
1275  .DayPickerKeyboardShortcuts_buttonReset:active {
1276    outline: 0; }
1277  
1278  .DayPickerKeyboardShortcuts_show {
1279    width: 22px;
1280    position: absolute;
1281    z-index: 2; }
1282  
1283  .DayPickerKeyboardShortcuts_show__bottomRight {
1284    border-top: 26px solid transparent;
1285    border-right: 33px solid #00a699;
1286    bottom: 0;
1287    right: 0; }
1288  
1289  .DayPickerKeyboardShortcuts_show__bottomRight:hover {
1290    border-right: 33px solid #008489; }
1291  
1292  .DayPickerKeyboardShortcuts_show__topRight {
1293    border-bottom: 26px solid transparent;
1294    border-right: 33px solid #00a699;
1295    top: 0;
1296    right: 0; }
1297  
1298  .DayPickerKeyboardShortcuts_show__topRight:hover {
1299    border-right: 33px solid #008489; }
1300  
1301  .DayPickerKeyboardShortcuts_show__topLeft {
1302    border-bottom: 26px solid transparent;
1303    border-left: 33px solid #00a699;
1304    top: 0;
1305    left: 0; }
1306  
1307  .DayPickerKeyboardShortcuts_show__topLeft:hover {
1308    border-left: 33px solid #008489; }
1309  
1310  .DayPickerKeyboardShortcuts_showSpan {
1311    color: #fff;
1312    position: absolute; }
1313  
1314  .DayPickerKeyboardShortcuts_showSpan__bottomRight {
1315    bottom: 0;
1316    right: -28px; }
1317  
1318  .DayPickerKeyboardShortcuts_showSpan__topRight {
1319    top: 1px;
1320    right: -28px; }
1321  
1322  .DayPickerKeyboardShortcuts_showSpan__topLeft {
1323    top: 1px;
1324    left: -28px; }
1325  
1326  .DayPickerKeyboardShortcuts_panel {
1327    overflow: auto;
1328    background: #fff;
1329    border: 1px solid #dbdbdb;
1330    border-radius: 2px;
1331    position: absolute;
1332    top: 0;
1333    bottom: 0;
1334    right: 0;
1335    left: 0;
1336    z-index: 2;
1337    padding: 22px;
1338    margin: 33px; }
1339  
1340  .DayPickerKeyboardShortcuts_title {
1341    font-size: 16px;
1342    font-weight: 700;
1343    margin: 0; }
1344  
1345  .DayPickerKeyboardShortcuts_list {
1346    list-style: none;
1347    padding: 0;
1348    font-size: 14px; }
1349  
1350  .DayPickerKeyboardShortcuts_close {
1351    position: absolute;
1352    right: 22px;
1353    top: 22px;
1354    z-index: 2; }
1355  
1356  .DayPickerKeyboardShortcuts_close:active {
1357    outline: 0; }
1358  
1359  .DayPickerKeyboardShortcuts_closeSvg {
1360    height: 15px;
1361    width: 15px;
1362    fill: #cacccd; }
1363  
1364  .DayPickerKeyboardShortcuts_closeSvg:focus,
1365  .DayPickerKeyboardShortcuts_closeSvg:hover {
1366    fill: #82888a; }
1367  
1368  .CalendarDay {
1369    box-sizing: border-box;
1370    cursor: pointer;
1371    font-size: 14px;
1372    text-align: center; }
1373  
1374  .CalendarDay:active {
1375    outline: 0; }
1376  
1377  .CalendarDay__defaultCursor {
1378    cursor: default; }
1379  
1380  .CalendarDay__default {
1381    border: 1px solid #e4e7e7;
1382    color: #484848;
1383    background: #fff; }
1384  
1385  .CalendarDay__default:hover {
1386    background: #e4e7e7;
1387    border: 1px double #e4e7e7;
1388    color: inherit; }
1389  
1390  .CalendarDay__hovered_offset {
1391    background: #f4f5f5;
1392    border: 1px double #e4e7e7;
1393    color: inherit; }
1394  
1395  .CalendarDay__outside {
1396    border: 0;
1397    background: #fff;
1398    color: #484848; }
1399  
1400  .CalendarDay__outside:hover {
1401    border: 0; }
1402  
1403  .CalendarDay__blocked_minimum_nights {
1404    background: #fff;
1405    border: 1px solid #eceeee;
1406    color: #cacccd; }
1407  
1408  .CalendarDay__blocked_minimum_nights:active,
1409  .CalendarDay__blocked_minimum_nights:hover {
1410    background: #fff;
1411    color: #cacccd; }
1412  
1413  .CalendarDay__highlighted_calendar {
1414    background: #ffe8bc;
1415    color: #484848; }
1416  
1417  .CalendarDay__highlighted_calendar:active,
1418  .CalendarDay__highlighted_calendar:hover {
1419    background: #ffce71;
1420    color: #484848; }
1421  
1422  .CalendarDay__selected_span {
1423    background: #66e2da;
1424    border: 1px solid #33dacd;
1425    color: #fff; }
1426  
1427  .CalendarDay__selected_span:active,
1428  .CalendarDay__selected_span:hover {
1429    background: #33dacd;
1430    border: 1px solid #33dacd;
1431    color: #fff; }
1432  
1433  .CalendarDay__last_in_range {
1434    border-right: #00a699; }
1435  
1436  .CalendarDay__selected,
1437  .CalendarDay__selected:active,
1438  .CalendarDay__selected:hover {
1439    background: #00a699;
1440    border: 1px solid #00a699;
1441    color: #fff; }
1442  
1443  .CalendarDay__hovered_span,
1444  .CalendarDay__hovered_span:hover {
1445    background: #b2f1ec;
1446    border: 1px solid #80e8e0;
1447    color: #007a87; }
1448  
1449  .CalendarDay__hovered_span:active {
1450    background: #80e8e0;
1451    border: 1px solid #80e8e0;
1452    color: #007a87; }
1453  
1454  .CalendarDay__blocked_calendar,
1455  .CalendarDay__blocked_calendar:active,
1456  .CalendarDay__blocked_calendar:hover {
1457    background: #cacccd;
1458    border: 1px solid #cacccd;
1459    color: #82888a; }
1460  
1461  .CalendarDay__blocked_out_of_range,
1462  .CalendarDay__blocked_out_of_range:active,
1463  .CalendarDay__blocked_out_of_range:hover {
1464    background: #fff;
1465    border: 1px solid #e4e7e7;
1466    color: #cacccd; }
1467  
1468  .CalendarMonth {
1469    background: #fff;
1470    text-align: center;
1471    vertical-align: top;
1472    -webkit-user-select: none;
1473    -ms-user-select: none;
1474    user-select: none; }
1475  
1476  .CalendarMonth_table {
1477    border-collapse: collapse;
1478    border-spacing: 0; }
1479  
1480  .CalendarMonth_verticalSpacing {
1481    border-collapse: separate; }
1482  
1483  .CalendarMonth_caption {
1484    color: #484848;
1485    font-size: 18px;
1486    text-align: center;
1487    padding-top: 22px;
1488    padding-bottom: 37px;
1489    caption-side: initial; }
1490  
1491  .CalendarMonth_caption__verticalScrollable {
1492    padding-top: 12px;
1493    padding-bottom: 7px; }
1494  
1495  .CalendarMonthGrid {
1496    background: #fff;
1497    text-align: left;
1498    z-index: 0; }
1499  
1500  .CalendarMonthGrid__animating {
1501    z-index: 1; }
1502  
1503  .CalendarMonthGrid__horizontal {
1504    position: absolute;
1505    left: 9px; }
1506  
1507  .CalendarMonthGrid__vertical {
1508    margin: 0 auto; }
1509  
1510  .CalendarMonthGrid__vertical_scrollable {
1511    margin: 0 auto;
1512    overflow-y: scroll; }
1513  
1514  .CalendarMonthGrid_month__horizontal {
1515    display: inline-block;
1516    vertical-align: top;
1517    min-height: 100%; }
1518  
1519  .CalendarMonthGrid_month__hideForAnimation {
1520    position: absolute;
1521    z-index: -1;
1522    opacity: 0;
1523    pointer-events: none; }
1524  
1525  .CalendarMonthGrid_month__hidden {
1526    visibility: hidden; }
1527  
1528  .DayPickerNavigation {
1529    position: relative;
1530    z-index: 2; }
1531  
1532  .DayPickerNavigation__horizontal {
1533    height: 0; }
1534  
1535  .DayPickerNavigation__verticalDefault {
1536    position: absolute;
1537    width: 100%;
1538    height: 52px;
1539    bottom: 0;
1540    left: 0; }
1541  
1542  .DayPickerNavigation__verticalScrollableDefault {
1543    position: relative; }
1544  
1545  .DayPickerNavigation_button {
1546    cursor: pointer;
1547    -webkit-user-select: none;
1548    -ms-user-select: none;
1549    user-select: none;
1550    border: 0;
1551    padding: 0;
1552    margin: 0; }
1553  
1554  .DayPickerNavigation_button__default {
1555    border: 1px solid #e4e7e7;
1556    background-color: #fff;
1557    color: #757575; }
1558  
1559  .DayPickerNavigation_button__default:focus,
1560  .DayPickerNavigation_button__default:hover {
1561    border: 1px solid #c4c4c4; }
1562  
1563  .DayPickerNavigation_button__default:active {
1564    background: #f2f2f2; }
1565  
1566  .DayPickerNavigation_button__horizontalDefault {
1567    position: absolute;
1568    top: 18px;
1569    line-height: .78;
1570    border-radius: 3px;
1571    padding: 6px 9px; }
1572  
1573  .DayPickerNavigation_leftButton__horizontalDefault {
1574    left: 22px; }
1575  
1576  .DayPickerNavigation_rightButton__horizontalDefault {
1577    right: 22px; }
1578  
1579  .DayPickerNavigation_button__verticalDefault {
1580    padding: 5px;
1581    background: #fff;
1582    box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1);
1583    position: relative;
1584    display: inline-block;
1585    height: 100%;
1586    width: 50%; }
1587  
1588  .DayPickerNavigation_nextButton__verticalDefault {
1589    border-left: 0; }
1590  
1591  .DayPickerNavigation_nextButton__verticalScrollableDefault {
1592    width: 100%; }
1593  
1594  .DayPickerNavigation_svg__horizontal {
1595    height: 19px;
1596    width: 19px;
1597    fill: #82888a;
1598    display: block; }
1599  
1600  .DayPickerNavigation_svg__vertical {
1601    height: 42px;
1602    width: 42px;
1603    fill: #484848;
1604    display: block; }
1605  
1606  .DayPicker {
1607    background: #fff;
1608    position: relative;
1609    text-align: left; }
1610  
1611  .DayPicker__horizontal {
1612    background: #fff; }
1613  
1614  .DayPicker__verticalScrollable {
1615    height: 100%; }
1616  
1617  .DayPicker__hidden {
1618    visibility: hidden; }
1619  
1620  .DayPicker__withBorder {
1621    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.07);
1622    border-radius: 3px; }
1623  
1624  .DayPicker_portal__horizontal {
1625    box-shadow: none;
1626    position: absolute;
1627    left: 50%;
1628    top: 50%; }
1629  
1630  .DayPicker_portal__vertical {
1631    position: initial; }
1632  
1633  .DayPicker_focusRegion {
1634    outline: 0; }
1635  
1636  .DayPicker_calendarInfo__horizontal,
1637  .DayPicker_wrapper__horizontal {
1638    display: inline-block;
1639    vertical-align: top; }
1640  
1641  .DayPicker_weekHeaders {
1642    position: relative; }
1643  
1644  .DayPicker_weekHeaders__horizontal {
1645    margin-left: 9px; }
1646  
1647  .DayPicker_weekHeader {
1648    color: #757575;
1649    position: absolute;
1650    top: 62px;
1651    z-index: 2;
1652    text-align: left; }
1653  
1654  .DayPicker_weekHeader__vertical {
1655    left: 50%; }
1656  
1657  .DayPicker_weekHeader__verticalScrollable {
1658    top: 0;
1659    display: table-row;
1660    border-bottom: 1px solid #dbdbdb;
1661    background: #fff;
1662    margin-left: 0;
1663    left: 0;
1664    width: 100%;
1665    text-align: center; }
1666  
1667  .DayPicker_weekHeader_ul {
1668    list-style: none;
1669    margin: 1px 0;
1670    padding-left: 0;
1671    padding-right: 0;
1672    font-size: 14px; }
1673  
1674  .DayPicker_weekHeader_li {
1675    display: inline-block;
1676    text-align: center; }
1677  
1678  .DayPicker_transitionContainer {
1679    position: relative;
1680    overflow: hidden;
1681    border-radius: 3px; }
1682  
1683  .DayPicker_transitionContainer__horizontal {
1684    transition: height .2s ease-in-out; }
1685  
1686  .DayPicker_transitionContainer__vertical {
1687    width: 100%; }
1688  
1689  .DayPicker_transitionContainer__verticalScrollable {
1690    padding-top: 20px;
1691    height: 100%;
1692    position: absolute;
1693    top: 0;
1694    bottom: 0;
1695    right: 0;
1696    left: 0;
1697    overflow-y: scroll; }
1698  
1699  .DateInput {
1700    margin: 0;
1701    padding: 0;
1702    background: #fff;
1703    position: relative;
1704    display: inline-block;
1705    width: 130px;
1706    vertical-align: middle; }
1707  
1708  .DateInput__small {
1709    width: 97px; }
1710  
1711  .DateInput__block {
1712    width: 100%; }
1713  
1714  .DateInput__disabled {
1715    background: #f2f2f2;
1716    color: #dbdbdb; }
1717  
1718  .DateInput_input {
1719    font-weight: 200;
1720    font-size: 19px;
1721    line-height: 24px;
1722    color: #484848;
1723    background-color: #fff;
1724    width: 100%;
1725    padding: 11px 11px 9px;
1726    border: 0;
1727    border-top: 0;
1728    border-right: 0;
1729    border-bottom: 2px solid transparent;
1730    border-left: 0;
1731    border-radius: 0; }
1732  
1733  .DateInput_input__small {
1734    font-size: 15px;
1735    line-height: 18px;
1736    letter-spacing: .2px;
1737    padding: 7px 7px 5px; }
1738  
1739  .DateInput_input__regular {
1740    font-weight: auto; }
1741  
1742  .DateInput_input__readOnly {
1743    -webkit-user-select: none;
1744    -ms-user-select: none;
1745    user-select: none; }
1746  
1747  .DateInput_input__focused {
1748    outline: 0;
1749    background: #fff;
1750    border: 0;
1751    border-top: 0;
1752    border-right: 0;
1753    border-bottom: 2px solid #008489;
1754    border-left: 0; }
1755  
1756  .DateInput_input__disabled {
1757    background: #f2f2f2;
1758    font-style: italic; }
1759  
1760  .DateInput_screenReaderMessage {
1761    border: 0;
1762    clip: rect(0, 0, 0, 0);
1763    height: 1px;
1764    margin: -1px;
1765    overflow: hidden;
1766    padding: 0;
1767    position: absolute;
1768    width: 1px; }
1769  
1770  .DateInput_fang {
1771    position: absolute;
1772    width: 20px;
1773    height: 10px;
1774    left: 22px;
1775    z-index: 2; }
1776  
1777  .DateInput_fangShape {
1778    fill: #fff; }
1779  
1780  .DateInput_fangStroke {
1781    stroke: #dbdbdb;
1782    fill: transparent; }
1783  
1784  .DateRangePickerInput {
1785    background-color: #fff;
1786    display: inline-block; }
1787  
1788  .DateRangePickerInput__disabled {
1789    background: #f2f2f2; }
1790  
1791  .DateRangePickerInput__withBorder {
1792    border-radius: 2px;
1793    border: 1px solid #dbdbdb; }
1794  
1795  .DateRangePickerInput__rtl {
1796    direction: rtl; }
1797  
1798  .DateRangePickerInput__block {
1799    display: block; }
1800  
1801  .DateRangePickerInput__showClearDates {
1802    padding-right: 30px; }
1803  
1804  .DateRangePickerInput_arrow {
1805    display: inline-block;
1806    vertical-align: middle;
1807    color: #484848; }
1808  
1809  .DateRangePickerInput_arrow_svg {
1810    vertical-align: middle;
1811    fill: #484848;
1812    height: 24px;
1813    width: 24px; }
1814  
1815  .DateRangePickerInput_clearDates {
1816    background: 0 0;
1817    border: 0;
1818    color: inherit;
1819    font: inherit;
1820    line-height: normal;
1821    overflow: visible;
1822    cursor: pointer;
1823    padding: 10px;
1824    margin: 0 10px 0 5px;
1825    position: absolute;
1826    right: 0;
1827    top: 50%;
1828    transform: translateY(-50%); }
1829  
1830  .DateRangePickerInput_clearDates__small {
1831    padding: 6px; }
1832  
1833  .DateRangePickerInput_clearDates_default:focus,
1834  .DateRangePickerInput_clearDates_default:hover {
1835    background: #dbdbdb;
1836    border-radius: 50%; }
1837  
1838  .DateRangePickerInput_clearDates__hide {
1839    visibility: hidden; }
1840  
1841  .DateRangePickerInput_clearDates_svg {
1842    fill: #82888a;
1843    height: 12px;
1844    width: 15px;
1845    vertical-align: middle; }
1846  
1847  .DateRangePickerInput_clearDates_svg__small {
1848    height: 9px; }
1849  
1850  .DateRangePickerInput_calendarIcon {
1851    background: 0 0;
1852    border: 0;
1853    color: inherit;
1854    font: inherit;
1855    line-height: normal;
1856    overflow: visible;
1857    cursor: pointer;
1858    display: inline-block;
1859    vertical-align: middle;
1860    padding: 10px;
1861    margin: 0 5px 0 10px; }
1862  
1863  .DateRangePickerInput_calendarIcon_svg {
1864    fill: #82888a;
1865    height: 15px;
1866    width: 14px;
1867    vertical-align: middle; }
1868  
1869  .DateRangePicker {
1870    position: relative;
1871    display: inline-block; }
1872  
1873  .DateRangePicker__block {
1874    display: block; }
1875  
1876  .DateRangePicker_picker {
1877    z-index: 1;
1878    background-color: #fff;
1879    position: absolute; }
1880  
1881  .DateRangePicker_picker__rtl {
1882    direction: rtl; }
1883  
1884  .DateRangePicker_picker__directionLeft {
1885    left: 0; }
1886  
1887  .DateRangePicker_picker__directionRight {
1888    right: 0; }
1889  
1890  .DateRangePicker_picker__portal {
1891    background-color: rgba(0, 0, 0, 0.3);
1892    position: fixed;
1893    top: 0;
1894    left: 0;
1895    height: 100%;
1896    width: 100%; }
1897  
1898  .DateRangePicker_picker__fullScreenPortal {
1899    background-color: #fff; }
1900  
1901  .DateRangePicker_closeButton {
1902    background: 0 0;
1903    border: 0;
1904    color: inherit;
1905    font: inherit;
1906    line-height: normal;
1907    overflow: visible;
1908    cursor: pointer;
1909    position: absolute;
1910    top: 0;
1911    right: 0;
1912    padding: 15px;
1913    z-index: 2; }
1914  
1915  .DateRangePicker_closeButton:focus,
1916  .DateRangePicker_closeButton:hover {
1917    color: #b0b3b4;
1918    text-decoration: none; }
1919  
1920  .DateRangePicker_closeButton_svg {
1921    height: 15px;
1922    width: 15px;
1923    fill: #cacccd; }
1924  
1925  /*rtl:end:ignore*/
1926  .components-datetime {
1927    padding: 16px; }
1928    .components-datetime .components-datetime__calendar-help {
1929      padding: 16px; }
1930      .components-datetime .components-datetime__calendar-help h4 {
1931        margin: 0; }
1932    .components-datetime .components-datetime__date-help-button {
1933      display: block;
1934      margin-left: auto; }
1935    .components-datetime fieldset {
1936      border: 0;
1937      padding: 0;
1938      margin: 0; }
1939    .components-datetime select,
1940    .components-datetime input {
1941      box-shadow: 0 0 0 transparent;
1942      transition: box-shadow 0.1s linear;
1943      border-radius: 4px;
1944      border: 1px solid #7e8993; }
1945      @media (prefers-reduced-motion: reduce) {
1946        .components-datetime select,
1947        .components-datetime input {
1948          transition-duration: 0s; } }
1949    .components-datetime select,
1950    .components-datetime input[type="number"],
1951    .components-datetime .components-button {
1952      height: 30px;
1953      margin-top: 0;
1954      margin-bottom: 0; }
1955  
1956  .components-datetime__date {
1957    min-height: 236px;
1958    border-top: 1px solid #e2e4e7; }
1959    .components-datetime__date .DayPickerNavigation_leftButton__horizontalDefault {
1960      left: 0; }
1961    .components-datetime__date .CalendarMonth_caption {
1962      font-size: 13px; }
1963    .components-datetime__date .CalendarDay {
1964      font-size: 13px;
1965      border: 1px solid transparent;
1966      border-radius: 50%;
1967      text-align: center; }
1968    .components-datetime__date .CalendarDay__selected {
1969      background: #0085ba; }
1970    body.admin-color-sunrise .components-datetime__date .CalendarDay__selected {
1971      background: #d1864a; }
1972    body.admin-color-ocean .components-datetime__date .CalendarDay__selected {
1973      background: #a3b9a2; }
1974    body.admin-color-midnight .components-datetime__date .CalendarDay__selected {
1975      background: #e14d43; }
1976    body.admin-color-ectoplasm .components-datetime__date .CalendarDay__selected {
1977      background: #a7b656; }
1978    body.admin-color-coffee .components-datetime__date .CalendarDay__selected {
1979      background: #c2a68c; }
1980    body.admin-color-blue .components-datetime__date .CalendarDay__selected {
1981      background: #82b4cb; }
1982    body.admin-color-light .components-datetime__date .CalendarDay__selected {
1983      background: #0085ba; }
1984      .components-datetime__date .CalendarDay__selected:hover {
1985        background: rgb(0, 113, 158); }
1986      body.admin-color-sunrise .components-datetime__date .CalendarDay__selected:hover {
1987        background: rgb(178, 114, 63); }
1988      body.admin-color-ocean .components-datetime__date .CalendarDay__selected:hover {
1989        background: rgb(139, 157, 138); }
1990      body.admin-color-midnight .components-datetime__date .CalendarDay__selected:hover {
1991        background: rgb(191, 65, 57); }
1992      body.admin-color-ectoplasm .components-datetime__date .CalendarDay__selected:hover {
1993        background: rgb(142, 155, 73); }
1994      body.admin-color-coffee .components-datetime__date .CalendarDay__selected:hover {
1995        background: rgb(165, 141, 119); }
1996      body.admin-color-blue .components-datetime__date .CalendarDay__selected:hover {
1997        background: rgb(111, 153, 173); }
1998      body.admin-color-light .components-datetime__date .CalendarDay__selected:hover {
1999        background: rgb(0, 113, 158); }
2000    .components-datetime__date .DayPickerNavigation_button__horizontalDefault {
2001      padding: 2px 8px;
2002      top: 20px; }
2003      .components-datetime__date .DayPickerNavigation_button__horizontalDefault:focus {
2004        color: #191e23;
2005        border-color: #007cba;
2006        box-shadow: 0 0 0 1px #007cba;
2007        outline: 2px solid transparent; }
2008    .components-datetime__date .DayPicker_weekHeader {
2009      top: 50px; }
2010      .components-datetime__date .DayPicker_weekHeader .DayPicker_weekHeader_ul {
2011        margin: 1px 0;
2012        padding-left: 0;
2013        padding-right: 0; }
2014    .components-datetime__date.is-description-visible .DayPicker,
2015    .components-datetime__date.is-description-visible .components-datetime__date-help-button {
2016      visibility: hidden; }
2017  
2018  .components-datetime__time {
2019    padding-bottom: 16px; }
2020    .components-datetime__time fieldset {
2021      position: relative;
2022      margin-bottom: 0.5em; }
2023    .components-datetime__time fieldset + fieldset {
2024      margin-bottom: 0; }
2025    .components-datetime__time .components-datetime__time-field-am-pm fieldset {
2026      margin-top: 0; }
2027    .components-datetime__time .components-datetime__time-wrapper {
2028      display: flex; }
2029      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-separator {
2030        display: inline-block;
2031        padding: 0 3px 0 0;
2032        color: #555d66; }
2033      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-am-button {
2034        margin-left: 8px;
2035        margin-right: -1px;
2036        border-radius: 3px 0 0 3px; }
2037      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-pm-button {
2038        margin-left: -1px;
2039        border-radius: 0 3px 3px 0; }
2040      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-am-button:focus,
2041      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-pm-button:focus {
2042        position: relative;
2043        z-index: 1; }
2044      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-am-button.is-pressed,
2045      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-pm-button.is-pressed {
2046        background: #edeff0;
2047        border-color: #8f98a1;
2048        box-shadow: inset 0 2px 5px -3px #555d66; }
2049        .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-am-button.is-pressed:focus,
2050        .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-pm-button.is-pressed:focus {
2051          box-shadow: inset 0 2px 5px -3px #555d66, 0 0 0 1px #fff, 0 0 0 3px #007cba; }
2052      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field-time {
2053        /*rtl:ignore*/
2054        direction: ltr; }
2055      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field.am-pm button {
2056        font-size: 11px;
2057        font-weight: 600; }
2058      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select {
2059        margin-right: 4px; }
2060        .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select:focus {
2061          position: relative;
2062          z-index: 1; }
2063      .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"] {
2064        padding: 2px;
2065        margin-right: 4px;
2066        text-align: center;
2067        -moz-appearance: textfield; }
2068        .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"]:focus {
2069          position: relative;
2070          z-index: 1; }
2071        .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"]::-webkit-inner-spin-button {
2072          -webkit-appearance: none;
2073          margin: 0; }
2074    .components-datetime__time.is-12-hour .components-datetime__time-field-day input {
2075      margin: 0 -4px 0 0 !important;
2076      border-radius: 4px 0 0 4px !important; }
2077    .components-datetime__time.is-12-hour .components-datetime__time-field-year input {
2078      border-radius: 0 4px 4px 0 !important; }
2079  
2080  .components-datetime__time-legend {
2081    font-weight: 600;
2082    margin-top: 0.5em; }
2083    .components-datetime__time-legend.invisible {
2084      position: absolute;
2085      top: -999em;
2086      left: -999em; }
2087  
2088  .components-datetime__time-field-hours-input,
2089  .components-datetime__time-field-minutes-input,
2090  .components-datetime__time-field-day-input {
2091    width: 35px; }
2092  
2093  .components-datetime__time-field-year-input {
2094    width: 55px; }
2095  
2096  .components-datetime__time-field-month-select {
2097    max-width: 145px; }
2098  
2099  .components-popover .components-datetime__date {
2100    padding-left: 4px; }
2101  
2102  .block-editor-dimension-control .components-base-control__field {
2103    display: flex;
2104    align-items: center; }
2105  
2106  .block-editor-dimension-control .components-base-control__label {
2107    display: flex;
2108    align-items: center;
2109    margin-right: 1em;
2110    margin-bottom: 0; }
2111    .block-editor-dimension-control .components-base-control__label .dashicon {
2112      margin-right: 0.5em; }
2113  
2114  .block-editor-dimension-control.is-manual .components-base-control__label {
2115    width: 10em; }
2116  
2117  .components-disabled {
2118    position: relative;
2119    pointer-events: none; }
2120    .components-disabled::after {
2121      content: "";
2122      position: absolute;
2123      top: 0;
2124      right: 0;
2125      bottom: 0;
2126      left: 0; }
2127    .components-disabled * {
2128      pointer-events: none; }
2129  
2130  body.is-dragging-components-draggable {
2131    cursor: move;
2132    /* Fallback for IE/Edge < 14 */
2133    cursor: grabbing !important; }
2134  
2135  .components-draggable__invisible-drag-image {
2136    position: fixed;
2137    left: -1000px;
2138    height: 50px;
2139    width: 50px; }
2140  
2141  .components-draggable__clone {
2142    position: fixed;
2143    padding: 20px;
2144    background: transparent;
2145    pointer-events: none;
2146    z-index: 1000000000;
2147    opacity: 0.8; }
2148  
2149  .components-drop-zone {
2150    position: absolute;
2151    top: 0;
2152    right: 0;
2153    bottom: 0;
2154    left: 0;
2155    z-index: 40;
2156    visibility: hidden;
2157    opacity: 0;
2158    transition: 0.3s opacity, 0.3s background-color, 0s visibility 0.3s;
2159    border: 2px solid #0071a1;
2160    border-radius: 2px; }
2161    @media (prefers-reduced-motion: reduce) {
2162      .components-drop-zone {
2163        transition-duration: 0s; } }
2164    .components-drop-zone.is-active {
2165      opacity: 1;
2166      visibility: visible;
2167      transition: 0.3s opacity, 0.3s background-color; }
2168      @media (prefers-reduced-motion: reduce) {
2169        .components-drop-zone.is-active {
2170          transition-duration: 0s; } }
2171    .components-drop-zone.is-dragging-over-element {
2172      background-color: rgba(0, 113, 161, 0.8); }
2173  
2174  .components-drop-zone__content {
2175    position: absolute;
2176    top: 50%;
2177    left: 0;
2178    right: 0;
2179    z-index: 50;
2180    transform: translateY(-50%);
2181    width: 100%;
2182    text-align: center;
2183    color: #fff;
2184    transition: transform 0.2s ease-in-out; }
2185    @media (prefers-reduced-motion: reduce) {
2186      .components-drop-zone__content {
2187        transition-duration: 0s; } }
2188  
2189  .components-drop-zone.is-dragging-over-element .components-drop-zone__content {
2190    transform: translateY(-50%) scale(1.05); }
2191  
2192  .components-drop-zone__content-icon,
2193  .components-drop-zone__content-text {
2194    display: block; }
2195  
2196  .components-drop-zone__content-icon {
2197    margin: 0 auto;
2198    line-height: 0;
2199    fill: currentColor; }
2200  
2201  .components-drop-zone__content-text {
2202    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; }
2203  
2204  .components-drop-zone__provider {
2205    height: 100%; }
2206  
2207  .components-dropdown {
2208    display: inline-block; }
2209  
2210  .components-dropdown-menu__indicator::after {
2211    content: "";
2212    pointer-events: none;
2213    display: block;
2214    width: 0;
2215    height: 0;
2216    border-left: 3px solid transparent;
2217    border-right: 3px solid transparent;
2218    border-top: 5px solid;
2219    margin-left: 4px;
2220    margin-right: 2px; }
2221  
2222  .components-dropdown-menu__popover .components-popover__content {
2223    width: 200px; }
2224  
2225  .components-dropdown-menu__menu {
2226    width: 100%;
2227    padding: 7px 0;
2228    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2229    font-size: 13px;
2230    line-height: 1.4; }
2231    .components-dropdown-menu__menu .components-dropdown-menu__menu-item,
2232    .components-dropdown-menu__menu .components-menu-item {
2233      width: 100%;
2234      padding: 6px;
2235      outline: none;
2236      cursor: pointer;
2237      margin-bottom: 4px; }
2238      .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator,
2239      .components-dropdown-menu__menu .components-menu-item.has-separator {
2240        margin-top: 6px;
2241        position: relative;
2242        overflow: visible; }
2243      .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator::before,
2244      .components-dropdown-menu__menu .components-menu-item.has-separator::before {
2245        display: block;
2246        content: "";
2247        box-sizing: content-box;
2248        background-color: #e2e4e7;
2249        position: absolute;
2250        top: -3px;
2251        left: 0;
2252        right: 0;
2253        height: 1px; }
2254      .components-dropdown-menu__menu .components-dropdown-menu__menu-item:focus:not(:disabled):not([aria-disabled="true"]):not(.is-secondary),
2255      .components-dropdown-menu__menu .components-menu-item:focus:not(:disabled):not([aria-disabled="true"]):not(.is-secondary) {
2256        color: #191e23;
2257        border: none;
2258        box-shadow: none;
2259        outline-offset: -2px;
2260        outline: 1px dotted #555d66; }
2261      .components-dropdown-menu__menu .components-dropdown-menu__menu-item:hover, .components-dropdown-menu__menu .components-dropdown-menu__menu-item:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):not(.is-tertiary):not(.is-primary):hover,
2262      .components-dropdown-menu__menu .components-menu-item:hover,
2263      .components-dropdown-menu__menu .components-menu-item:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):not(.is-tertiary):not(.is-primary):hover {
2264        color: #191e23;
2265        border: none;
2266        box-shadow: none;
2267        background: #f3f4f5;
2268        box-shadow: none; }
2269      .components-dropdown-menu__menu .components-dropdown-menu__menu-item > svg,
2270      .components-dropdown-menu__menu .components-menu-item > svg {
2271        border-radius: 4px;
2272        padding: 2px;
2273        width: 24px;
2274        height: 24px;
2275        margin: -1px 8px -1px 0; }
2276      .components-dropdown-menu__menu .components-dropdown-menu__menu-item:not(:disabled):not([aria-disabled="true"]):not(.is-secondary).is-active > svg,
2277      .components-dropdown-menu__menu .components-menu-item:not(:disabled):not([aria-disabled="true"]):not(.is-secondary).is-active > svg {
2278        outline: none;
2279        color: #fff;
2280        box-shadow: none;
2281        background: #555d66; }
2282    .components-dropdown-menu__menu .components-menu-group:not(:last-child) {
2283      border-bottom: 1px solid #e2e4e7; }
2284    .components-dropdown-menu__menu .components-menu-item__button,
2285    .components-dropdown-menu__menu .components-menu-item__button.components-button {
2286      height: auto;
2287      padding-left: 2rem; }
2288      .components-dropdown-menu__menu .components-menu-item__button.has-icon,
2289      .components-dropdown-menu__menu .components-menu-item__button.components-button.has-icon {
2290        padding-left: 0.5rem; }
2291      .components-dropdown-menu__menu .components-menu-item__button .dashicon,
2292      .components-dropdown-menu__menu .components-menu-item__button.components-button .dashicon {
2293        margin-right: 4px; }
2294  
2295  .components-external-link__icon {
2296    width: 1.4em;
2297    height: 1.4em;
2298    margin: -0.2em 0.1em 0;
2299    vertical-align: middle; }
2300  
2301  .components-focal-point-picker-wrapper {
2302    background-color: transparent;
2303    border: 1px solid #e2e4e7;
2304    height: 200px;
2305    width: 100%;
2306    padding: 14px; }
2307  
2308  .components-focal-point-picker {
2309    align-items: center;
2310    cursor: pointer;
2311    display: flex;
2312    height: 100%;
2313    justify-content: center;
2314    position: relative;
2315    width: 100%; }
2316    .components-focal-point-picker img {
2317      height: auto;
2318      max-height: 100%;
2319      max-width: 100%;
2320      width: auto;
2321      -webkit-user-select: none;
2322          -ms-user-select: none;
2323              user-select: none; }
2324  
2325  .components-focal-point-picker__icon_container {
2326    background-color: transparent;
2327    cursor: grab;
2328    height: 30px;
2329    opacity: 0.8;
2330    position: absolute;
2331    will-change: transform;
2332    width: 30px;
2333    z-index: 10000; }
2334    .components-focal-point-picker__icon_container.is-dragging {
2335      cursor: grabbing; }
2336  
2337  .components-focal-point-picker__icon {
2338    display: block;
2339    height: 100%;
2340    left: -15px;
2341    position: absolute;
2342    top: -15px;
2343    width: 100%; }
2344    .components-focal-point-picker__icon .components-focal-point-picker__icon-outline {
2345      fill: #fff; }
2346    .components-focal-point-picker__icon .components-focal-point-picker__icon-fill {
2347      fill: #0085ba; }
2348    body.admin-color-sunrise .components-focal-point-picker__icon .components-focal-point-picker__icon-fill {
2349      fill: #d1864a; }
2350    body.admin-color-ocean .components-focal-point-picker__icon .components-focal-point-picker__icon-fill {
2351      fill: #a3b9a2; }
2352    body.admin-color-midnight .components-focal-point-picker__icon .components-focal-point-picker__icon-fill {
2353      fill: #e14d43; }
2354    body.admin-color-ectoplasm .components-focal-point-picker__icon .components-focal-point-picker__icon-fill {
2355      fill: #a7b656; }
2356    body.admin-color-coffee .components-focal-point-picker__icon .components-focal-point-picker__icon-fill {
2357      fill: #c2a68c; }
2358    body.admin-color-blue .components-focal-point-picker__icon .components-focal-point-picker__icon-fill {
2359      fill: #82b4cb; }
2360    body.admin-color-light .components-focal-point-picker__icon .components-focal-point-picker__icon-fill {
2361      fill: #0085ba; }
2362  
2363  .components-focal-point-picker_position-display-container {
2364    margin: 1em 0;
2365    display: flex; }
2366    .components-focal-point-picker_position-display-container .components-base-control__field {
2367      margin: 0 1em 0 0; }
2368    .components-focal-point-picker_position-display-container input[type="number"].components-text-control__input {
2369      max-width: 4em;
2370      padding: 6px 4px; }
2371    .components-focal-point-picker_position-display-container span {
2372      margin: 0 0 0 0.2em; }
2373  
2374  .components-font-size-picker__controls {
2375    max-width: 248px;
2376    display: flex;
2377    align-items: center;
2378    margin-bottom: 24px; }
2379    .components-font-size-picker__controls .components-range-control__number {
2380      height: 30px;
2381      margin-bottom: 0;
2382      margin-top: 5px;
2383      margin-left: 0;
2384      margin-right: 8px; }
2385      .components-font-size-picker__controls .components-range-control__number[value=""] + .components-button {
2386        cursor: default;
2387        opacity: 0.3;
2388        pointer-events: none; }
2389      .components-font-size-picker__controls .components-range-control__number-container {
2390        display: flex;
2391        flex-direction: column; }
2392    .components-font-size-picker__controls .components-font-size-picker__select {
2393      margin-right: 8px;
2394      flex-grow: 1; }
2395    .components-font-size-picker__controls .components-color-palette__clear {
2396      height: 30px;
2397      margin-top: 23px; }
2398  
2399  .components-font-size-picker__custom-input .components-range-control__slider + .dashicon {
2400    width: 30px;
2401    height: 30px; }
2402  
2403  .components-font-size-picker {
2404    border: 0;
2405    padding: 0;
2406    margin: 0; }
2407  
2408  .components-form-toggle {
2409    position: relative;
2410    display: inline-block; }
2411    .components-form-toggle .components-form-toggle__on,
2412    .components-form-toggle .components-form-toggle__off {
2413      position: absolute;
2414      top: 6px;
2415      box-sizing: border-box; }
2416    .components-form-toggle .components-form-toggle__off {
2417      color: #6c7781;
2418      fill: currentColor;
2419      right: 6px; }
2420    .components-form-toggle .components-form-toggle__on {
2421      left: 8px; }
2422    .components-form-toggle .components-form-toggle__track {
2423      content: "";
2424      display: inline-block;
2425      box-sizing: border-box;
2426      vertical-align: top;
2427      background-color: #fff;
2428      border: 2px solid #6c7781;
2429      width: 36px;
2430      height: 18px;
2431      border-radius: 9px;
2432      transition: 0.2s background ease; }
2433      @media (prefers-reduced-motion: reduce) {
2434        .components-form-toggle .components-form-toggle__track {
2435          transition-duration: 0s; } }
2436    .components-form-toggle .components-form-toggle__thumb {
2437      display: block;
2438      position: absolute;
2439      box-sizing: border-box;
2440      top: 4px;
2441      left: 4px;
2442      width: 10px;
2443      height: 10px;
2444      border-radius: 50%;
2445      transition: 0.1s transform ease;
2446      background-color: #6c7781;
2447      border: 5px solid #6c7781; }
2448      @media (prefers-reduced-motion: reduce) {
2449        .components-form-toggle .components-form-toggle__thumb {
2450          transition-duration: 0s; } }
2451    .components-form-toggle:hover .components-form-toggle__track {
2452      border: 2px solid #555d66; }
2453    .components-form-toggle:hover .components-form-toggle__thumb {
2454      background-color: #555d66;
2455      border: 5px solid #6c7781; }
2456    .components-form-toggle:hover .components-form-toggle__off {
2457      color: #555d66; }
2458    .components-form-toggle.is-checked .components-form-toggle__track {
2459      background-color: #11a0d2;
2460      border: 2px solid #11a0d2;
2461      border: 9px solid transparent; }
2462    body.admin-color-sunrise .components-form-toggle.is-checked .components-form-toggle__track {
2463      background-color: #c8b03c;
2464      border: 2px solid #c8b03c; }
2465    body.admin-color-ocean .components-form-toggle.is-checked .components-form-toggle__track {
2466      background-color: #a3b9a2;
2467      border: 2px solid #a3b9a2; }
2468    body.admin-color-midnight .components-form-toggle.is-checked .components-form-toggle__track {
2469      background-color: #77a6b9;
2470      border: 2px solid #77a6b9; }
2471    body.admin-color-ectoplasm .components-form-toggle.is-checked .components-form-toggle__track {
2472      background-color: #a7b656;
2473      border: 2px solid #a7b656; }
2474    body.admin-color-coffee .components-form-toggle.is-checked .components-form-toggle__track {
2475      background-color: #c2a68c;
2476      border: 2px solid #c2a68c; }
2477    body.admin-color-blue .components-form-toggle.is-checked .components-form-toggle__track {
2478      background-color: #82b4cb;
2479      border: 2px solid #82b4cb; }
2480    body.admin-color-light .components-form-toggle.is-checked .components-form-toggle__track {
2481      background-color: #11a0d2;
2482      border: 2px solid #11a0d2; }
2483    .components-form-toggle__input:focus + .components-form-toggle__track {
2484      box-shadow: 0 0 0 2px #fff, 0 0 0 3px #6c7781;
2485      outline: 2px solid transparent;
2486      outline-offset: 2px; }
2487    .components-form-toggle.is-checked .components-form-toggle__thumb {
2488      background-color: #fff;
2489      border-width: 0;
2490      transform: translateX(18px); }
2491    .components-form-toggle.is-checked::before {
2492      background-color: #11a0d2;
2493      border: 2px solid #11a0d2; }
2494    body.admin-color-sunrise .components-form-toggle.is-checked::before {
2495      background-color: #c8b03c;
2496      border: 2px solid #c8b03c; }
2497    body.admin-color-ocean .components-form-toggle.is-checked::before {
2498      background-color: #a3b9a2;
2499      border: 2px solid #a3b9a2; }
2500    body.admin-color-midnight .components-form-toggle.is-checked::before {
2501      background-color: #77a6b9;
2502      border: 2px solid #77a6b9; }
2503    body.admin-color-ectoplasm .components-form-toggle.is-checked::before {
2504      background-color: #a7b656;
2505      border: 2px solid #a7b656; }
2506    body.admin-color-coffee .components-form-toggle.is-checked::before {
2507      background-color: #c2a68c;
2508      border: 2px solid #c2a68c; }
2509    body.admin-color-blue .components-form-toggle.is-checked::before {
2510      background-color: #82b4cb;
2511      border: 2px solid #82b4cb; }
2512    body.admin-color-light .components-form-toggle.is-checked::before {
2513      background-color: #11a0d2;
2514      border: 2px solid #11a0d2; }
2515    .components-disabled .components-form-toggle {
2516      opacity: 0.3; }
2517  
2518  .components-form-toggle input.components-form-toggle__input[type="checkbox"] {
2519    position: absolute;
2520    top: 0;
2521    left: 0;
2522    width: 100%;
2523    height: 100%;
2524    opacity: 0;
2525    margin: 0;
2526    padding: 0;
2527    z-index: 1;
2528    border: none; }
2529    .components-form-toggle input.components-form-toggle__input[type="checkbox"]:checked {
2530      background: none; }
2531    .components-form-toggle input.components-form-toggle__input[type="checkbox"]::before {
2532      content: ""; }
2533  
2534  .components-form-toggle .components-form-toggle__on {
2535    outline: 1px solid transparent;
2536    outline-offset: -1px;
2537    border: 1px solid #000;
2538    filter: invert(100%) contrast(500%); }
2539  
2540  @supports (-ms-high-contrast-adjust: auto) {
2541    .components-form-toggle .components-form-toggle__on {
2542      filter: none;
2543      border: 1px solid #fff; } }
2544  
2545  .components-form-token-field__input-container {
2546    display: flex;
2547    flex-wrap: wrap;
2548    align-items: flex-start;
2549    width: 100%;
2550    margin: 0 0 8px 0;
2551    padding: 4px;
2552    background-color: #fff;
2553    border: 1px solid #ccd0d4;
2554    color: #32373c;
2555    cursor: text;
2556    box-shadow: 0 0 0 transparent;
2557    transition: box-shadow 0.1s linear;
2558    border-radius: 4px;
2559    border: 1px solid #7e8993; }
2560    @media (prefers-reduced-motion: reduce) {
2561      .components-form-token-field__input-container {
2562        transition-duration: 0s; } }
2563    .components-form-token-field__input-container.is-disabled {
2564      background: #e2e4e7;
2565      border-color: #ccd0d4; }
2566    .components-form-token-field__input-container.is-active {
2567      color: #191e23;
2568      border-color: #007cba;
2569      box-shadow: 0 0 0 1px #007cba;
2570      outline: 2px solid transparent; }
2571    .components-form-token-field__input-container input[type="text"].components-form-token-field__input {
2572      display: inline-block;
2573      width: 100%;
2574      max-width: 100%;
2575      margin: 2px 0 2px 8px;
2576      padding: 0;
2577      min-height: 24px;
2578      background: inherit;
2579      border: 0;
2580      color: #23282d;
2581      box-shadow: none; }
2582      .components-form-token-field__input-container input[type="text"].components-form-token-field__input:focus,
2583      .components-form-token-field.is-active .components-form-token-field__input-container input[type="text"].components-form-token-field__input {
2584        outline: none;
2585        box-shadow: none; }
2586    .components-form-token-field__input-container .components-form-token-field__token + input[type="text"].components-form-token-field__input {
2587      width: auto; }
2588  
2589  .components-form-token-field__label {
2590    display: inline-block;
2591    margin-bottom: 4px; }
2592  
2593  .components-form-token-field__help {
2594    font-style: italic; }
2595  
2596  .components-form-token-field__token {
2597    font-size: 13px;
2598    display: flex;
2599    margin: 2px 4px 2px 0;
2600    color: #32373c;
2601    overflow: hidden; }
2602    .components-form-token-field__token.is-success .components-form-token-field__token-text,
2603    .components-form-token-field__token.is-success .components-form-token-field__remove-token {
2604      background: #4ab866; }
2605    .components-form-token-field__token.is-error .components-form-token-field__token-text,
2606    .components-form-token-field__token.is-error .components-form-token-field__remove-token {
2607      background: #d94f4f; }
2608    .components-form-token-field__token.is-validating .components-form-token-field__token-text,
2609    .components-form-token-field__token.is-validating .components-form-token-field__remove-token {
2610      color: #555d66; }
2611    .components-form-token-field__token.is-borderless {
2612      position: relative;
2613      padding: 0 16px 0 0; }
2614      .components-form-token-field__token.is-borderless .components-form-token-field__token-text {
2615        background: transparent;
2616        color: #11a0d2; }
2617      body.admin-color-sunrise .components-form-token-field__token.is-borderless .components-form-token-field__token-text {
2618        color: #c8b03c; }
2619      body.admin-color-ocean .components-form-token-field__token.is-borderless .components-form-token-field__token-text {
2620        color: #a89d8a; }
2621      body.admin-color-midnight .components-form-token-field__token.is-borderless .components-form-token-field__token-text {
2622        color: #77a6b9; }
2623      body.admin-color-ectoplasm .components-form-token-field__token.is-borderless .components-form-token-field__token-text {
2624        color: #c77430; }
2625      body.admin-color-coffee .components-form-token-field__token.is-borderless .components-form-token-field__token-text {
2626        color: #9fa47b; }
2627      body.admin-color-blue .components-form-token-field__token.is-borderless .components-form-token-field__token-text {
2628        color: #d9ab59; }
2629      body.admin-color-light .components-form-token-field__token.is-borderless .components-form-token-field__token-text {
2630        color: #c75726; }
2631      .components-form-token-field__token.is-borderless .components-form-token-field__remove-token {
2632        background: transparent;
2633        color: #555d66;
2634        position: absolute;
2635        top: 1px;
2636        right: 0; }
2637      .components-form-token-field__token.is-borderless.is-success .components-form-token-field__token-text {
2638        color: #4ab866; }
2639      .components-form-token-field__token.is-borderless.is-error .components-form-token-field__token-text {
2640        color: #d94f4f;
2641        border-radius: 4px 0 0 4px;
2642        padding: 0 4px 0 6px; }
2643      .components-form-token-field__token.is-borderless.is-validating .components-form-token-field__token-text {
2644        color: #23282d; }
2645    .components-form-token-field__token.is-disabled .components-form-token-field__remove-token {
2646      cursor: default; }
2647  
2648  .components-form-token-field__token-text,
2649  .components-form-token-field__remove-token.components-button {
2650    display: inline-block;
2651    line-height: 24px;
2652    height: auto;
2653    background: #e2e4e7;
2654    transition: all 0.2s cubic-bezier(0.4, 1, 0.4, 1); }
2655    @media (prefers-reduced-motion: reduce) {
2656      .components-form-token-field__token-text,
2657      .components-form-token-field__remove-token.components-button {
2658        transition-duration: 0s;
2659        animation-duration: 1ms; } }
2660  
2661  .components-form-token-field__token-text {
2662    border-radius: 12px 0 0 12px;
2663    padding: 0 4px 0 8px;
2664    white-space: nowrap;
2665    overflow: hidden;
2666    text-overflow: ellipsis; }
2667  
2668  .components-form-token-field__remove-token.components-button {
2669    cursor: pointer;
2670    border-radius: 0 12px 12px 0;
2671    padding: 0 2px;
2672    color: #555d66;
2673    line-height: 10px;
2674    overflow: initial; }
2675    .components-form-token-field__remove-token.components-button:hover {
2676      color: #32373c; }
2677  
2678  .components-form-token-field__suggestions-list {
2679    flex: 1 0 100%;
2680    min-width: 100%;
2681    max-height: 9em;
2682    overflow-y: scroll;
2683    transition: all 0.15s ease-in-out;
2684    list-style: none;
2685    border-top: 1px solid #6c7781;
2686    margin: 4px -4px -4px;
2687    padding-top: 3px; }
2688    @media (prefers-reduced-motion: reduce) {
2689      .components-form-token-field__suggestions-list {
2690        transition-duration: 0s; } }
2691  
2692  .components-form-token-field__suggestion {
2693    color: #555d66;
2694    display: block;
2695    font-size: 13px;
2696    padding: 4px 8px;
2697    cursor: pointer; }
2698    .components-form-token-field__suggestion.is-selected {
2699      background: #0071a1;
2700      color: #fff; }
2701  
2702  .components-form-token-field__suggestion-match {
2703    text-decoration: underline; }
2704  
2705  .components-guide .components-modal__header {
2706    background: none;
2707    border-bottom: none; }
2708    .components-guide .components-modal__header .components-button {
2709      align-self: flex-start;
2710      margin-top: 24px;
2711      position: static; }
2712  
2713  .components-guide__container {
2714    display: flex;
2715    flex-direction: column;
2716    margin-top: -56px;
2717    min-height: 100%; }
2718  
2719  .components-guide__footer {
2720    align-content: center;
2721    display: flex;
2722    height: 30px;
2723    justify-content: center;
2724    margin: auto 0 24px 0;
2725    position: relative;
2726    width: 100%; }
2727    @media (min-width: 600px) {
2728      .components-guide__footer {
2729        margin: 24px 0 0; } }
2730  
2731  .components-guide__page-control {
2732    margin: 0; }
2733    .components-guide__page-control li {
2734      display: inline-block;
2735      margin: 0 2px; }
2736    .components-guide__page-control .components-button {
2737      height: 30px; }
2738  
2739  @media (max-width: 600px) {
2740    .components-modal__frame.components-guide {
2741      bottom: 15%;
2742      left: 24px;
2743      right: 24px;
2744      top: 15%; } }
2745  
2746  .components-button.components-guide__back-button, .components-button.components-guide__forward-button, .components-button.components-guide__finish-button {
2747    height: 30px;
2748    position: absolute; }
2749  
2750  .components-button.components-guide__back-button, .components-button.components-guide__forward-button {
2751    font-size: 0;
2752    padding: 4px 2px; }
2753    .components-button.components-guide__back-button.has-text svg, .components-button.components-guide__forward-button.has-text svg {
2754      margin: 0; }
2755    @media (min-width: 600px) {
2756      .components-button.components-guide__back-button, .components-button.components-guide__forward-button {
2757        font-size: 13px; } }
2758  
2759  .components-button.components-guide__back-button {
2760    left: 0; }
2761    @media (min-width: 600px) {
2762      .components-button.components-guide__back-button {
2763        padding: 4px 8px 4px 2px; }
2764        .components-button.components-guide__back-button.has-text svg {
2765          margin-right: 4px; } }
2766  
2767  .components-button.components-guide__forward-button {
2768    right: 0; }
2769    @media (min-width: 600px) {
2770      .components-button.components-guide__forward-button {
2771        padding: 4px 2px 4px 8px; }
2772        .components-button.components-guide__forward-button.has-text svg {
2773          margin-left: 4px;
2774          order: 1; } }
2775  
2776  .components-button.components-guide__finish-button {
2777    display: none;
2778    right: 0; }
2779    @media (min-width: 600px) {
2780      .components-button.components-guide__finish-button {
2781        display: block; } }
2782  
2783  @media (min-width: 600px) {
2784    .components-button.components-guide__inline-finish-button {
2785      display: none; } }
2786  
2787  .components-navigate-regions.is-focusing-regions [role="region"] {
2788    position: relative; }
2789    .components-navigate-regions.is-focusing-regions [role="region"]:focus::after {
2790      content: "";
2791      position: absolute;
2792      top: 0;
2793      bottom: 0;
2794      left: 0;
2795      right: 0;
2796      pointer-events: none;
2797      outline: 4px solid transparent;
2798      box-shadow: inset 0 0 0 4px #33b3db; }
2799    @supports (outline-offset: 1px) {
2800      .components-navigate-regions.is-focusing-regions [role="region"]:focus::after {
2801        content: none; }
2802      .components-navigate-regions.is-focusing-regions [role="region"]:focus {
2803        outline-style: solid;
2804        outline-color: #33b3db;
2805        outline-width: 4px;
2806        outline-offset: -4px; } }
2807  
2808  .components-menu-group {
2809    width: 100%;
2810    padding: 7px 0; }
2811  
2812  .components-menu-group__label {
2813    margin-bottom: 8px;
2814    color: #6c7781;
2815    padding: 0 7px; }
2816  
2817  .components-menu-item__button,
2818  .components-menu-item__button.components-button {
2819    width: 100%;
2820    padding: 8px 15px;
2821    text-align: left;
2822    color: #40464d;
2823    border: none;
2824    box-shadow: none; }
2825    .components-menu-item__button .dashicon,
2826    .components-menu-item__button .components-menu-items__item-icon,
2827    .components-menu-item__button svg.components-menu-items__item-icon,
2828    .components-menu-item__button > span > svg,
2829    .components-menu-item__button.components-button .dashicon,
2830    .components-menu-item__button.components-button .components-menu-items__item-icon,
2831    .components-menu-item__button.components-button svg.components-menu-items__item-icon,
2832    .components-menu-item__button.components-button > span > svg {
2833      margin-right: 4px; }
2834    .components-menu-item__button .components-menu-items__item-icon,
2835    .components-menu-item__button.components-button .components-menu-items__item-icon {
2836      display: inline-block;
2837      flex: 0 0 auto; }
2838    .components-menu-item__button.components-button:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):not(.is-tertiary):not(.is-primary):hover,
2839    .components-menu-item__button.components-button.components-button:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):not(.is-tertiary):not(.is-primary):hover {
2840      color: #191e23;
2841      border: none;
2842      box-shadow: none;
2843      background: #f3f4f5; }
2844      .components-menu-item__button.components-button:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):not(.is-tertiary):not(.is-primary):hover .components-menu-item__shortcut,
2845      .components-menu-item__button.components-button.components-button:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):not(.is-tertiary):not(.is-primary):hover .components-menu-item__shortcut {
2846        color: #40464d; }
2847    .components-menu-item__button:focus:not(:disabled):not([aria-disabled="true"]),
2848    .components-menu-item__button.components-button:focus:not(:disabled):not([aria-disabled="true"]) {
2849      color: #191e23;
2850      border: none;
2851      box-shadow: none;
2852      outline-offset: -2px;
2853      outline: 1px dotted #555d66; }
2854  
2855  .components-menu-item__info-wrapper {
2856    display: flex;
2857    flex-direction: column; }
2858  
2859  .components-menu-item__info {
2860    margin-top: 4px;
2861    font-size: 12px;
2862    color: #6c7781; }
2863  
2864  .components-menu-item__shortcut {
2865    -ms-grid-row-align: center;
2866        align-self: center;
2867    color: #6c7781;
2868    margin-right: 0;
2869    margin-left: auto;
2870    padding-left: 8px;
2871    display: none; }
2872    @media (min-width: 480px) {
2873      .components-menu-item__shortcut {
2874        display: inline; } }
2875  
2876  .components-menu-items-choice,
2877  .components-menu-items-choice.components-button {
2878    padding-left: 2rem; }
2879    .components-menu-items-choice.has-icon,
2880    .components-menu-items-choice.components-button.has-icon {
2881      padding-left: 0.5rem; }
2882  
2883  .components-modal__screen-overlay {
2884    position: fixed;
2885    top: 0;
2886    right: 0;
2887    bottom: 0;
2888    left: 0;
2889    background-color: rgba(0, 0, 0, 0.7);
2890    z-index: 100000;
2891    animation: edit-post__fade-in-animation 0.2s ease-out 0s;
2892    animation-fill-mode: forwards; }
2893    @media (prefers-reduced-motion: reduce) {
2894      .components-modal__screen-overlay {
2895        animation-duration: 1ms; } }
2896  
2897  .components-modal__frame {
2898    position: absolute;
2899    top: 0;
2900    right: 0;
2901    bottom: 0;
2902    left: 0;
2903    box-sizing: border-box;
2904    margin: 0;
2905    border: 1px solid #e2e4e7;
2906    background: #fff;
2907    box-shadow: 0 3px 30px rgba(25, 30, 35, 0.2);
2908    overflow: auto; }
2909    @media (min-width: 600px) {
2910      .components-modal__frame {
2911        top: 50%;
2912        right: auto;
2913        bottom: auto;
2914        left: 50%;
2915        min-width: 360px;
2916        max-width: calc(100% - 16px - 16px);
2917        max-height: calc(100% - 56px - 56px);
2918        transform: translate(-50%, -50%);
2919        animation: components-modal__appear-animation 0.1s ease-out;
2920        animation-fill-mode: forwards; } }
2921    @media (min-width: 600px) and (prefers-reduced-motion: reduce) {
2922      .components-modal__frame {
2923        animation-duration: 1ms; } }
2924  
2925  @keyframes components-modal__appear-animation {
2926    from {
2927      margin-top: 32px; }
2928    to {
2929      margin-top: 0; } }
2930  
2931  .components-modal__header {
2932    box-sizing: border-box;
2933    border-bottom: 1px solid #e2e4e7;
2934    padding: 0 24px;
2935    display: flex;
2936    flex-direction: row;
2937    justify-content: space-between;
2938    background: #fff;
2939    align-items: center;
2940    height: 56px;
2941    z-index: 10;
2942    position: relative;
2943    position: -webkit-sticky;
2944    position: sticky;
2945    top: 0;
2946    margin: 0 -24px 24px; }
2947    @supports (-ms-ime-align: auto) {
2948      .components-modal__header {
2949        position: fixed;
2950        width: 100%; } }
2951    .components-modal__header .components-modal__header-heading {
2952      font-size: 1rem;
2953      font-weight: 600; }
2954    .components-modal__header h1 {
2955      line-height: 1;
2956      margin: 0; }
2957    .components-modal__header .components-button {
2958      position: relative;
2959      left: 8px; }
2960  
2961  .components-modal__header-heading-container {
2962    align-items: center;
2963    flex-grow: 1;
2964    display: flex;
2965    flex-direction: row;
2966    justify-content: left; }
2967  
2968  .components-modal__header-icon-container {
2969    display: inline-block; }
2970    .components-modal__header-icon-container svg {
2971      max-width: 36px;
2972      max-height: 36px;
2973      padding: 8px; }
2974  
2975  .components-modal__content {
2976    box-sizing: border-box;
2977    height: 100%;
2978    padding: 0 24px 24px; }
2979    @supports (-ms-ime-align: auto) {
2980      .components-modal__content {
2981        padding-top: 56px; } }
2982  
2983  .components-notice {
2984    display: flex;
2985    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2986    font-size: 13px;
2987    background-color: #e5f5fa;
2988    border-left: 4px solid #00a0d2;
2989    margin: 5px 15px 2px;
2990    padding: 8px 12px;
2991    align-items: center; }
2992    .components-notice.is-dismissible {
2993      padding-right: 36px;
2994      position: relative; }
2995    .components-notice.is-success {
2996      border-left-color: #4ab866;
2997      background-color: #eff9f1; }
2998    .components-notice.is-warning {
2999      border-left-color: #f0b849;
3000      background-color: #fef8ee; }
3001    .components-notice.is-error {
3002      border-left-color: #d94f4f;
3003      background-color: #f9e2e2; }
3004  
3005  .components-notice__content {
3006    flex-grow: 1;
3007    margin: 4px 25px 4px 0; }
3008  
3009  .components-notice__action.components-button, .components-notice__action.components-button.is-link {
3010    margin-left: 4px; }
3011  
3012  .components-notice__action.components-button.is-secondary {
3013    vertical-align: initial; }
3014  
3015  .components-notice__dismiss {
3016    color: #6c7781;
3017    align-self: flex-start;
3018    flex-shrink: 0; }
3019    .components-notice__dismiss:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):hover, .components-notice__dismiss:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):active, .components-notice__dismiss:not(:disabled):not([aria-disabled="true"]):focus {
3020      color: #191e23;
3021      background-color: transparent; }
3022    .components-notice__dismiss:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):hover {
3023      box-shadow: none; }
3024  
3025  .components-notice-list {
3026    max-width: 100vw;
3027    box-sizing: border-box;
3028    z-index: 29; }
3029    .components-notice-list .components-notice__content {
3030      margin-top: 12px;
3031      margin-bottom: 12px;
3032      line-height: 1.6; }
3033    .components-notice-list .components-notice__action.components-button {
3034      margin-top: -2px;
3035      margin-bottom: -2px; }
3036  
3037  .components-panel {
3038    background: #fff;
3039    border: 1px solid #e2e4e7; }
3040    .components-panel > .components-panel__header:first-child,
3041    .components-panel > .components-panel__body:first-child {
3042      margin-top: -1px; }
3043    .components-panel > .components-panel__header:last-child,
3044    .components-panel > .components-panel__body:last-child {
3045      border-bottom-width: 0; }
3046  
3047  .components-panel + .components-panel {
3048    margin-top: -1px; }
3049  
3050  .components-panel__body {
3051    border-top: 1px solid #e2e4e7;
3052    border-bottom: 1px solid #e2e4e7; }
3053    .components-panel__body h3 {
3054      margin: 0 0 0.5em; }
3055    .components-panel__body.is-opened {
3056      padding: 16px; }
3057  
3058  .components-panel__header {
3059    display: flex;
3060    justify-content: space-between;
3061    align-items: center;
3062    padding: 0 16px;
3063    height: 50px;
3064    border-top: 1px solid #e2e4e7;
3065    border-bottom: 1px solid #e2e4e7; }
3066    .components-panel__header h2 {
3067      margin: 0;
3068      font-size: inherit;
3069      color: inherit; }
3070  
3071  .components-panel__body + .components-panel__body,
3072  .components-panel__body + .components-panel__header,
3073  .components-panel__header + .components-panel__body,
3074  .components-panel__header + .components-panel__header {
3075    margin-top: -1px; }
3076  
3077  .components-panel__body > .components-panel__body-title {
3078    display: block;
3079    padding: 0;
3080    font-size: inherit;
3081    margin-top: 0;
3082    margin-bottom: 0;
3083    transition: 0.1s background ease-in-out; }
3084    @media (prefers-reduced-motion: reduce) {
3085      .components-panel__body > .components-panel__body-title {
3086        transition-duration: 0s; } }
3087  
3088  .components-panel__body.is-opened > .components-panel__body-title {
3089    margin: -16px;
3090    margin-bottom: 5px; }
3091  
3092  .components-panel__body > .components-panel__body-title:hover {
3093    background: #f3f4f5 !important;
3094    border: none !important; }
3095  
3096  .components-panel__body-toggle.components-button {
3097    position: relative;
3098    padding: 15px;
3099    outline: none;
3100    width: 100%;
3101    font-weight: 600;
3102    text-align: left;
3103    color: #191e23;
3104    border: none;
3105    box-shadow: none;
3106    transition: 0.1s background ease-in-out;
3107    height: auto;
3108    /* rtl:begin:ignore */
3109    /* rtl:end:ignore */ }
3110    @media (prefers-reduced-motion: reduce) {
3111      .components-panel__body-toggle.components-button {
3112        transition-duration: 0s; } }
3113    .components-panel__body-toggle.components-button:focus:not(:disabled):not([aria-disabled="true"]) {
3114      color: #191e23;
3115      border: none;
3116      box-shadow: none;
3117      outline-offset: -2px;
3118      outline: 1px dotted #555d66; }
3119    .components-panel__body-toggle.components-button:hover {
3120      background: transparent !important;
3121      border: none !important;
3122      box-shadow: none !important; }
3123    .components-panel__body-toggle.components-button .components-panel__arrow {
3124      position: absolute;
3125      right: 10px;
3126      top: 50%;
3127      transform: translateY(-50%);
3128      color: #191e23;
3129      fill: currentColor;
3130      transition: 0.1s color ease-in-out; }
3131      @media (prefers-reduced-motion: reduce) {
3132        .components-panel__body-toggle.components-button .components-panel__arrow {
3133          transition-duration: 0s; } }
3134    body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right {
3135      transform: scaleX(-1);
3136      -ms-filter: fliph;
3137      filter: FlipH;
3138      margin-top: -10px; }
3139  
3140  .components-panel__icon {
3141    color: #555d66;
3142    margin: -2px 0 -2px 6px; }
3143  
3144  .components-panel__body-toggle-icon {
3145    margin-right: -5px; }
3146  
3147  .components-panel__color-title {
3148    float: left;
3149    height: 19px; }
3150  
3151  .components-panel__row {
3152    display: flex;
3153    justify-content: space-between;
3154    align-items: center;
3155    margin-top: 20px; }
3156    .components-panel__row select {
3157      min-width: 0; }
3158    .components-panel__row label {
3159      margin-right: 10px;
3160      flex-shrink: 0;
3161      max-width: 75%; }
3162    .components-panel__row:empty, .components-panel__row:first-of-type {
3163      margin-top: 0; }
3164  
3165  .components-panel .circle-picker {
3166    padding-bottom: 20px; }
3167  
3168  .components-placeholder.components-placeholder {
3169    position: relative;
3170    margin-bottom: 28px;
3171    padding: 1em;
3172    min-height: 200px;
3173    width: 100%;
3174    text-align: left;
3175    background: rgba(139, 139, 150, 0.1); }
3176    @supports ((position: -webkit-sticky) or (position: sticky)) {
3177      .components-placeholder.components-placeholder {
3178        display: flex;
3179        flex-direction: column;
3180        justify-content: center;
3181        align-items: flex-start; } }
3182    .is-dark-theme .components-placeholder.components-placeholder {
3183      background: rgba(255, 255, 255, 0.15); }
3184    .components-placeholder.components-placeholder .components-base-control__label {
3185      font-size: 13px; }
3186  
3187  .components-placeholder__error,
3188  .components-placeholder__instructions,
3189  .components-placeholder__label,
3190  .components-placeholder__fieldset {
3191    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3192    font-size: 13px; }
3193  
3194  .components-placeholder__label {
3195    display: flex;
3196    font-weight: 600;
3197    margin-bottom: 1em; }
3198    .components-placeholder__label > svg,
3199    .components-placeholder__label .dashicon,
3200    .components-placeholder__label .block-editor-block-icon {
3201      fill: currentColor;
3202      margin-right: 1ch; }
3203  
3204  .components-placeholder__fieldset,
3205  .components-placeholder__fieldset form {
3206    display: flex;
3207    flex-direction: row;
3208    width: 100%;
3209    flex-wrap: wrap;
3210    z-index: 1; }
3211    .components-placeholder__fieldset p,
3212    .components-placeholder__fieldset form p {
3213      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3214      font-size: 13px; }
3215  
3216  .components-placeholder__fieldset.is-column-layout,
3217  .components-placeholder__fieldset.is-column-layout form {
3218    flex-direction: column; }
3219  
3220  .components-placeholder__input {
3221    margin: 0 8px 0 0;
3222    flex: 1 1 auto; }
3223  
3224  .components-placeholder__instructions {
3225    margin-bottom: 1em; }
3226  
3227  .components-placeholder__error {
3228    margin-top: 1em;
3229    width: 100%; }
3230  
3231  .components-placeholder__preview img {
3232    margin: 3%;
3233    width: 50%; }
3234  
3235  .components-placeholder__fieldset .components-button {
3236    margin-right: 8px;
3237    margin-bottom: 8px; }
3238    .components-placeholder__fieldset .components-button:last-child {
3239      margin-bottom: 0;
3240      margin-right: 0; }
3241  
3242  .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link {
3243    margin-left: 10px;
3244    margin-right: 10px; }
3245    .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link:last-child {
3246      margin-right: 0; }
3247  
3248  .components-placeholder.is-medium .components-placeholder__instructions, .components-placeholder.is-small .components-placeholder__instructions {
3249    display: none; }
3250  
3251  .components-placeholder.is-medium .components-placeholder__fieldset,
3252  .components-placeholder.is-medium .components-placeholder__fieldset form, .components-placeholder.is-small .components-placeholder__fieldset,
3253  .components-placeholder.is-small .components-placeholder__fieldset form {
3254    flex-direction: column; }
3255  
3256  .components-placeholder.is-medium .components-placeholder__fieldset .components-button, .components-placeholder.is-small .components-placeholder__fieldset .components-button {
3257    margin-right: auto; }
3258  
3259  .components-placeholder.is-small .block-editor-block-icon {
3260    display: none; }
3261  
3262  .components-placeholder.is-small .components-button {
3263    padding: 0 8px 2px; }
3264  
3265  /*!rtl:begin:ignore*/
3266  .components-popover {
3267    position: fixed;
3268    z-index: 1000000;
3269    top: 0;
3270    left: 0;
3271    opacity: 0; }
3272    .components-popover.is-expanded, .components-popover[data-x-axis][data-y-axis] {
3273      opacity: 1; }
3274    .components-popover.is-expanded {
3275      top: 0;
3276      left: 0;
3277      right: 0;
3278      bottom: 0;
3279      z-index: 1000000 !important; }
3280    .components-popover:not(.is-without-arrow) {
3281      margin-left: 2px; }
3282      .components-popover:not(.is-without-arrow)::before {
3283        border: 8px solid #e2e4e7; }
3284      .components-popover:not(.is-without-arrow)::after {
3285        border: 8px solid #fff; }
3286      .components-popover:not(.is-without-arrow)::before, .components-popover:not(.is-without-arrow)::after {
3287        content: "";
3288        position: absolute;
3289        height: 0;
3290        width: 0;
3291        line-height: 0; }
3292      .components-popover:not(.is-without-arrow)[data-y-axis="top"] {
3293        margin-top: -8px; }
3294        .components-popover:not(.is-without-arrow)[data-y-axis="top"]::before {
3295          bottom: -8px; }
3296        .components-popover:not(.is-without-arrow)[data-y-axis="top"]::after {
3297          bottom: -6px; }
3298        .components-popover:not(.is-without-arrow)[data-y-axis="top"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="top"]::after {
3299          border-bottom: none;
3300          border-left-color: transparent;
3301          border-right-color: transparent;
3302          border-top-style: solid;
3303          margin-left: -10px; }
3304      .components-popover:not(.is-without-arrow)[data-y-axis="bottom"] {
3305        margin-top: 8px; }
3306        .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::before {
3307          top: -8px; }
3308        .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::after {
3309          top: -6px; }
3310        .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::after {
3311          border-bottom-style: solid;
3312          border-left-color: transparent;
3313          border-right-color: transparent;
3314          border-top: none;
3315          margin-left: -10px; }
3316      .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"] {
3317        margin-left: -8px; }
3318        .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::before {
3319          right: -8px; }
3320        .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::after {
3321          right: -6px; }
3322        .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::after {
3323          border-bottom-color: transparent;
3324          border-left-style: solid;
3325          border-right: none;
3326          border-top-color: transparent; }
3327      .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"] {
3328        margin-left: 8px; }
3329        .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::before {
3330          left: -8px; }
3331        .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::after {
3332          left: -6px; }
3333        .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::after {
3334          border-bottom-color: transparent;
3335          border-left: none;
3336          border-right-style: solid;
3337          border-top-color: transparent; }
3338    .components-popover[data-y-axis="top"] {
3339      bottom: 100%; }
3340    .components-popover[data-y-axis="bottom"] {
3341      top: 100%; }
3342    .components-popover[data-y-axis="middle"] {
3343      align-items: center;
3344      display: flex; }
3345  
3346  .components-popover__content {
3347    box-shadow: 0 3px 30px rgba(25, 30, 35, 0.1);
3348    border: 1px solid #e2e4e7;
3349    background: #fff;
3350    height: 100%; }
3351    .components-popover .components-popover__content {
3352      position: absolute;
3353      height: auto;
3354      overflow-y: auto;
3355      min-width: 260px; }
3356    .components-popover.is-expanded .components-popover__content {
3357      position: static;
3358      height: calc(100% - 50px);
3359      overflow-y: visible;
3360      min-width: auto;
3361      border: none;
3362      border-top: 1px solid #e2e4e7; }
3363    .components-popover[data-y-axis="top"] .components-popover__content {
3364      bottom: 100%; }
3365    .components-popover[data-x-axis="center"] .components-popover__content {
3366      left: 50%;
3367      transform: translateX(-50%); }
3368    .components-popover[data-x-axis="right"] .components-popover__content {
3369      position: absolute;
3370      left: 100%; }
3371    .components-popover:not([data-y-axis="middle"])[data-x-axis="right"] .components-popover__content {
3372      margin-left: -24px; }
3373    .components-popover[data-x-axis="left"] .components-popover__content {
3374      position: absolute;
3375      right: 100%; }
3376    .components-popover:not([data-y-axis="middle"])[data-x-axis="left"] .components-popover__content {
3377      margin-right: -24px; }
3378  
3379  .components-popover__content > div {
3380    height: 100%; }
3381  
3382  .components-popover__header {
3383    align-items: center;
3384    background: #fff;
3385    display: flex;
3386    height: 50px;
3387    justify-content: space-between;
3388    padding: 0 8px 0 16px; }
3389  
3390  .components-popover__header-title {
3391    overflow: hidden;
3392    text-overflow: ellipsis;
3393    white-space: nowrap;
3394    width: 100%; }
3395  
3396  .components-popover__close.components-button {
3397    z-index: 5; }
3398  
3399  /*!rtl:end:ignore*/
3400  .components-radio-control {
3401    display: flex;
3402    flex-direction: column; }
3403    .components-radio-control .components-base-control__help {
3404      margin-top: 0; }
3405    .components-radio-control .components-base-control__field {
3406      margin-bottom: 0; }
3407  
3408  .components-radio-control__option:not(:last-child) {
3409    margin-bottom: 4px; }
3410  
3411  .components-radio-control__input[type="radio"] {
3412    margin-top: 0;
3413    margin-right: 6px; }
3414  
3415  .components-range-control .components-base-control__field {
3416    display: flex;
3417    justify-content: center;
3418    flex-wrap: wrap;
3419    align-items: center; }
3420  
3421  .components-range-control .dashicon {
3422    flex-shrink: 0;
3423    margin-right: 10px; }
3424  
3425  .components-range-control .components-base-control__label {
3426    width: 100%; }
3427  
3428  .components-range-control .components-range-control__slider {
3429    margin-left: 0;
3430    flex: 1; }
3431  
3432  .components-range-control__reset {
3433    margin-left: 8px; }
3434  
3435  .components-range-control__slider {
3436    width: 100%;
3437    margin-left: 8px;
3438    padding: 0;
3439    -webkit-appearance: none;
3440    background: transparent;
3441    /**
3442        * Thumb
3443        */
3444    /**
3445        * Track
3446        */ }
3447    .components-range-control__slider::-webkit-slider-thumb {
3448      -webkit-appearance: none;
3449      height: 18px;
3450      width: 18px;
3451      border-radius: 50%;
3452      cursor: pointer;
3453      background: #555d66;
3454      border: 4px solid transparent;
3455      background-clip: padding-box;
3456      box-sizing: border-box;
3457      margin-top: -7px; }
3458    .components-range-control__slider::-moz-range-thumb {
3459      height: 18px;
3460      width: 18px;
3461      border-radius: 50%;
3462      cursor: pointer;
3463      background: #555d66;
3464      border: 4px solid transparent;
3465      background-clip: padding-box;
3466      box-sizing: border-box; }
3467    .components-range-control__slider::-ms-thumb {
3468      height: 18px;
3469      width: 18px;
3470      border-radius: 50%;
3471      cursor: pointer;
3472      background: #555d66;
3473      border: 4px solid transparent;
3474      background-clip: padding-box;
3475      box-sizing: border-box;
3476      margin-top: 0;
3477      height: 14px;
3478      width: 14px;
3479      border: 2px solid transparent; }
3480    .components-range-control__slider:focus {
3481      outline: none; }
3482    .components-range-control__slider:focus::-webkit-slider-thumb {
3483      background-color: #fff;
3484      color: #191e23;
3485      box-shadow: inset 0 0 0 1px #6c7781, inset 0 0 0 2px #fff;
3486      outline: 2px solid transparent; }
3487    .components-range-control__slider:focus::-moz-range-thumb {
3488      background-color: #fff;
3489      color: #191e23;
3490      box-shadow: inset 0 0 0 1px #6c7781, inset 0 0 0 2px #fff;
3491      outline: 2px solid transparent; }
3492    .components-range-control__slider:focus::-ms-thumb {
3493      background-color: #fff;
3494      color: #191e23;
3495      box-shadow: inset 0 0 0 1px #6c7781, inset 0 0 0 2px #fff;
3496      outline: 2px solid transparent; }
3497    .components-range-control__slider::-webkit-slider-runnable-track {
3498      height: 3px;
3499      cursor: pointer;
3500      background: #e2e4e7;
3501      border-radius: 1.5px;
3502      margin-top: -4px; }
3503    .components-range-control__slider::-moz-range-track {
3504      height: 3px;
3505      cursor: pointer;
3506      background: #e2e4e7;
3507      border-radius: 1.5px; }
3508    .components-range-control__slider::-ms-track {
3509      margin-top: -4px;
3510      background: transparent;
3511      border-color: transparent;
3512      color: transparent;
3513      height: 3px;
3514      cursor: pointer;
3515      background: #e2e4e7;
3516      border-radius: 1.5px; }
3517  
3518  .components-range-control__number {
3519    display: inline-block;
3520    margin-left: 8px;
3521    font-weight: 500;
3522    width: 54px; }
3523  
3524  .components-resizable-box__handle {
3525    display: none;
3526    width: 23px;
3527    height: 23px; }
3528    .components-resizable-box__container.is-selected .components-resizable-box__handle,
3529    .components-resizable-box__container.has-show-handle .components-resizable-box__handle {
3530      display: block; }
3531  
3532  .components-resizable-box__handle::after {
3533    display: block;
3534    content: "";
3535    width: 15px;
3536    height: 15px;
3537    border: 2px solid #fff;
3538    border-radius: 50%;
3539    background: #0085ba;
3540    cursor: inherit;
3541    position: absolute;
3542    top: calc(50% - 8px);
3543    right: calc(50% - 8px); }
3544  
3545  body.admin-color-sunrise .components-resizable-box__handle::after {
3546    background: #d1864a; }
3547  
3548  body.admin-color-ocean .components-resizable-box__handle::after {
3549    background: #a3b9a2; }
3550  
3551  body.admin-color-midnight .components-resizable-box__handle::after {
3552    background: #e14d43; }
3553  
3554  body.admin-color-ectoplasm .components-resizable-box__handle::after {
3555    background: #a7b656; }
3556  
3557  body.admin-color-coffee .components-resizable-box__handle::after {
3558    background: #c2a68c; }
3559  
3560  body.admin-color-blue .components-resizable-box__handle::after {
3561    background: #82b4cb; }
3562  
3563  body.admin-color-light .components-resizable-box__handle::after {
3564    background: #0085ba; }
3565  
3566  .components-resizable-box__side-handle::before {
3567    display: block;
3568    content: "";
3569    width: 7px;
3570    height: 7px;
3571    border: 2px solid #fff;
3572    background: #0085ba;
3573    cursor: inherit;
3574    position: absolute;
3575    top: calc(50% - 4px);
3576    right: calc(50% - 4px);
3577    transition: transform 0.1s ease-in;
3578    opacity: 0; }
3579  
3580  body.admin-color-sunrise .components-resizable-box__side-handle::before {
3581    background: #d1864a; }
3582  
3583  body.admin-color-ocean .components-resizable-box__side-handle::before {
3584    background: #a3b9a2; }
3585  
3586  body.admin-color-midnight .components-resizable-box__side-handle::before {
3587    background: #e14d43; }
3588  
3589  body.admin-color-ectoplasm .components-resizable-box__side-handle::before {
3590    background: #a7b656; }
3591  
3592  body.admin-color-coffee .components-resizable-box__side-handle::before {
3593    background: #c2a68c; }
3594  
3595  body.admin-color-blue .components-resizable-box__side-handle::before {
3596    background: #82b4cb; }
3597  
3598  body.admin-color-light .components-resizable-box__side-handle::before {
3599    background: #0085ba; }
3600    @media (prefers-reduced-motion: reduce) {
3601      .components-resizable-box__side-handle::before {
3602        transition-duration: 0s; } }
3603  
3604  .is-dark-theme .components-resizable-box__side-handle::before,
3605  .is-dark-theme .components-resizable-box__handle::after {
3606    border-color: #d7dade; }
3607  
3608  .components-resizable-box__side-handle {
3609    z-index: 1; }
3610  
3611  .components-resizable-box__corner-handle {
3612    z-index: 2; }
3613  
3614  .components-resizable-box__side-handle.components-resizable-box__handle-top,
3615  .components-resizable-box__side-handle.components-resizable-box__handle-bottom,
3616  .components-resizable-box__side-handle.components-resizable-box__handle-top::before,
3617  .components-resizable-box__side-handle.components-resizable-box__handle-bottom::before {
3618    width: 100%;
3619    left: 0;
3620    border-left: 0;
3621    border-right: 0; }
3622  
3623  .components-resizable-box__side-handle.components-resizable-box__handle-left,
3624  .components-resizable-box__side-handle.components-resizable-box__handle-right,
3625  .components-resizable-box__side-handle.components-resizable-box__handle-left::before,
3626  .components-resizable-box__side-handle.components-resizable-box__handle-right::before {
3627    height: 100%;
3628    top: 0;
3629    border-top: 0;
3630    border-bottom: 0; }
3631  
3632  .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before,
3633  .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before,
3634  .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before,
3635  .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before {
3636    animation: components-resizable-box__top-bottom-animation 0.1s ease-out 0s;
3637    animation-fill-mode: forwards; }
3638    @media (prefers-reduced-motion: reduce) {
3639      .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before,
3640      .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before,
3641      .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before,
3642      .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before {
3643        animation-duration: 1ms; } }
3644  
3645  .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before,
3646  .components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before,
3647  .components-resizable-box__side-handle.components-resizable-box__handle-left:active::before,
3648  .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before {
3649    animation: components-resizable-box__left-right-animation 0.1s ease-out 0s;
3650    animation-fill-mode: forwards; }
3651    @media (prefers-reduced-motion: reduce) {
3652      .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before,
3653      .components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before,
3654      .components-resizable-box__side-handle.components-resizable-box__handle-left:active::before,
3655      .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before {
3656        animation-duration: 1ms; } }
3657  
3658  @keyframes components-resizable-box__top-bottom-animation {
3659    from {
3660      transform: scaleX(0);
3661      opacity: 0; }
3662    to {
3663      transform: scaleX(1);
3664      opacity: 1; } }
3665  
3666  @keyframes components-resizable-box__left-right-animation {
3667    from {
3668      transform: scaleY(0);
3669      opacity: 0; }
3670    to {
3671      transform: scaleY(1);
3672      opacity: 1; } }
3673  
3674  /*!rtl:begin:ignore*/
3675  .components-resizable-box__handle-right {
3676    right: calc(11.5px * -1); }
3677  
3678  .components-resizable-box__handle-left {
3679    left: calc(11.5px * -1); }
3680  
3681  .components-resizable-box__handle-top {
3682    top: calc(11.5px * -1); }
3683  
3684  .components-resizable-box__handle-bottom {
3685    bottom: calc(11.5px * -1); }
3686  
3687  /*!rtl:end:ignore*/
3688  .components-responsive-wrapper {
3689    position: relative;
3690    max-width: 100%; }
3691    .components-responsive-wrapper,
3692    .components-responsive-wrapper > span {
3693      display: block; }
3694  
3695  .components-responsive-wrapper__content {
3696    position: absolute;
3697    top: 0;
3698    right: 0;
3699    bottom: 0;
3700    left: 0;
3701    width: 100%;
3702    height: 100%;
3703    margin: auto; }
3704  
3705  .components-sandbox {
3706    overflow: hidden; }
3707  
3708  iframe.components-sandbox {
3709    width: 100%; }
3710  
3711  html.lockscroll,
3712  body.lockscroll {
3713    overflow: hidden; }
3714  
3715  .components-select-control__input {
3716    background: #fff;
3717    height: 36px;
3718    line-height: 36px;
3719    margin: 1px;
3720    outline: 0;
3721    width: 100%;
3722    -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important; }
3723    @media (min-width: 782px) {
3724      .components-select-control__input {
3725        height: 28px;
3726        line-height: 28px; } }
3727  
3728  @media (max-width: 782px) {
3729    .components-base-control .components-base-control__field .components-select-control__input {
3730      font-size: 16px; } }
3731  
3732  .components-snackbar {
3733    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3734    font-size: 13px;
3735    background-color: #32373c;
3736    border-radius: 4px;
3737    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
3738    color: #fff;
3739    padding: 16px 24px;
3740    width: 100%;
3741    max-width: 600px;
3742    box-sizing: border-box;
3743    cursor: pointer; }
3744    @media (min-width: 600px) {
3745      .components-snackbar {
3746        width: fit-content; } }
3747    .components-snackbar:hover {
3748      background-color: #191e23; }
3749    .components-snackbar:focus {
3750      background-color: #191e23;
3751      box-shadow: 0 0 0 1px #fff, 0 0 0 3px #007cba; }
3752  
3753  .components-snackbar__action.components-button {
3754    margin-left: 32px;
3755    color: #fff;
3756    height: auto;
3757    flex-shrink: 0;
3758    line-height: 1.4;
3759    padding: 0; }
3760    .components-snackbar__action.components-button:not(:disabled):not([aria-disabled="true"]):not(.is-secondary) {
3761      text-decoration: underline;
3762      background-color: transparent; }
3763      .components-snackbar__action.components-button:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):focus {
3764        color: #fff;
3765        box-shadow: none;
3766        outline: 1px dotted #fff; }
3767      .components-snackbar__action.components-button:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):hover {
3768        color: #33b3db; }
3769  
3770  .components-snackbar__content {
3771    display: flex;
3772    align-items: baseline;
3773    justify-content: space-between;
3774    line-height: 1.4; }
3775  
3776  .components-snackbar-list {
3777    position: absolute;
3778    z-index: 100000;
3779    width: 100%;
3780    box-sizing: border-box; }
3781  
3782  .components-snackbar-list__notice-container {
3783    position: relative;
3784    padding-top: 8px; }
3785  
3786  .components-spinner {
3787    display: inline-block;
3788    background-color: #7e8993;
3789    width: 18px;
3790    height: 18px;
3791    opacity: 0.7;
3792    margin: 5px 11px 0;
3793    border-radius: 100%;
3794    position: relative; }
3795    .components-spinner::before {
3796      /* rtl:begin:ignore */
3797      content: "";
3798      position: absolute;
3799      background-color: #fff;
3800      top: 3px;
3801      left: 3px;
3802      width: 4px;
3803      height: 4px;
3804      border-radius: 100%;
3805      transform-origin: 6px 6px;
3806      animation: components-spinner__animation 1s infinite linear;
3807      /* rtl:end:ignore */ }
3808  
3809  @keyframes components-spinner__animation {
3810    from {
3811      transform: rotate(0deg); }
3812    to {
3813      transform: rotate(360deg); } }
3814  
3815  .components-text-control__input {
3816    width: 100%;
3817    padding: 6px 8px; }
3818  
3819  .components-textarea-control__input {
3820    width: 100%;
3821    padding: 6px 8px; }
3822  
3823  .components-tip {
3824    display: flex;
3825    color: #555d66; }
3826    .components-tip svg {
3827      -ms-grid-row-align: center;
3828          align-self: center;
3829      fill: #f0b849;
3830      flex-shrink: 0;
3831      margin-right: 16px; }
3832    .components-tip p {
3833      margin: 0; }
3834  
3835  .components-toggle-control .components-base-control__field {
3836    display: flex;
3837    margin-bottom: 12px;
3838    line-height: initial;
3839    align-items: center; }
3840    .components-toggle-control .components-base-control__field .components-form-toggle {
3841      margin-right: 16px; }
3842    .components-toggle-control .components-base-control__field .components-toggle-control__label {
3843      display: block; }
3844  
3845  .components-accessible-toolbar {
3846    display: inline-flex;
3847    flex-shrink: 0; }
3848    @supports ((position: -webkit-sticky) or (position: sticky)) {
3849      .components-accessible-toolbar {
3850        display: flex; } }
3851  
3852  .components-tab-button {
3853    padding: 3px;
3854    color: #555d66;
3855    height: 36px;
3856    font-weight: 500; }
3857    .components-tab-button.is-pressed, .components-tab-button.is-pressed:hover {
3858      color: #fff; }
3859    .components-tab-button:disabled {
3860      cursor: default; }
3861    .components-tab-button > span {
3862      border: 1px solid transparent;
3863      padding: 0 6px;
3864      box-sizing: content-box;
3865      height: 28px;
3866      line-height: 28px; }
3867    .components-tab-button:hover > span,
3868    .components-tab-button:focus > span {
3869      color: #555d66; }
3870    .components-tab-button:not(:disabled).is-pressed > span,
3871    .components-tab-button:not(:disabled):hover > span,
3872    .components-tab-button:not(:disabled):focus > span {
3873      border: 1px solid #555d66; }
3874    .components-tab-button.is-pressed > span,
3875    .components-tab-button.is-pressed:hover > span {
3876      background-color: #555d66;
3877      color: #fff; }
3878  
3879  .components-toolbar__control.components-button {
3880    width: 36px;
3881    height: 36px; }
3882    .components-toolbar__control.components-button[data-subscript] svg {
3883      padding: 5px 10px 5px 0; }
3884    .components-toolbar__control.components-button[data-subscript]::after {
3885      content: attr(data-subscript);
3886      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3887      font-size: 13px;
3888      font-weight: 600;
3889      line-height: 12px;
3890      position: absolute;
3891      right: 8px;
3892      bottom: 10px; }
3893    .components-toolbar__control.components-button:not(:disabled).is-pressed[data-subscript]::after {
3894      color: #fff; }
3895    .components-toolbar__control.components-button.is-pressed {
3896      padding: 3px;
3897      outline: none; }
3898    .components-toolbar__control.components-button.is-pressed > svg {
3899      padding: 5px;
3900      border-radius: 4px;
3901      height: 30px;
3902      width: 30px;
3903      box-sizing: border-box;
3904      outline: none;
3905      color: #fff;
3906      box-shadow: none;
3907      background: #555d66; }
3908  
3909  .components-toolbar-group {
3910    border: 1px solid #e2e4e7;
3911    background-color: #fff;
3912    display: flex;
3913    flex-shrink: 0;
3914    margin-right: -1px;
3915    line-height: 0; }
3916    .components-toolbar-group .components-toolbar-group {
3917      border-width: 0;
3918      margin: 0; }
3919  
3920  .components-toolbar {
3921    margin: 0;
3922    border: 1px solid #e2e4e7;
3923    background-color: #fff;
3924    display: flex;
3925    flex-shrink: 0; }
3926  
3927  div.components-toolbar > div {
3928    display: block;
3929    margin: 0; }
3930    @supports ((position: -webkit-sticky) or (position: sticky)) {
3931      div.components-toolbar > div {
3932        display: flex; } }
3933  
3934  div.components-toolbar > div + div {
3935    margin-left: -3px; }
3936    div.components-toolbar > div + div.has-left-divider {
3937      margin-left: 6px;
3938      position: relative;
3939      overflow: visible; }
3940    div.components-toolbar > div + div.has-left-divider::before {
3941      display: inline-block;
3942      content: "";
3943      box-sizing: content-box;
3944      background-color: #e2e4e7;
3945      position: absolute;
3946      top: 8px;
3947      left: -3px;
3948      width: 1px;
3949      height: 20px; }
3950  
3951  .components-tooltip.components-popover {
3952    z-index: 1000002; }
3953    .components-tooltip.components-popover::before {
3954      border-color: transparent; }
3955    .components-tooltip.components-popover[data-y-axis="top"]::after {
3956      border-top-color: #191e23; }
3957    .components-tooltip.components-popover[data-y-axis="bottom"]::after {
3958      border-bottom-color: #191e23; }
3959    .components-tooltip.components-popover .components-popover__content {
3960      min-width: 0; }
3961  
3962  .components-tooltip .components-popover__content {
3963    padding: 4px 12px;
3964    background: #191e23;
3965    border-width: 0;
3966    color: #fff;
3967    white-space: nowrap;
3968    text-align: center; }
3969  
3970  .components-tooltip__shortcut {
3971    display: block;
3972    color: #7e8993; }
3973  
3974  .components-visually-hidden {
3975    border: 0;
3976    clip: rect(1px, 1px, 1px, 1px);
3977    -webkit-clip-path: inset(50%);
3978    clip-path: inset(50%);
3979    height: 1px;
3980    margin: -1px;
3981    overflow: hidden;
3982    padding: 0;
3983    position: absolute;
3984    width: 1px;
3985    word-wrap: normal !important; }
3986  
3987  .components-visually-hidden:focus {
3988    background-color: #e2e4e7;
3989    clip: auto !important;
3990    -webkit-clip-path: none;
3991            clip-path: none;
3992    color: #444;
3993    display: block;
3994    font-size: 1em;
3995    height: auto;
3996    left: 5px;
3997    line-height: normal;
3998    padding: 15px 23px 14px;
3999    text-decoration: none;
4000    top: 5px;
4001    width: auto;
4002    z-index: 100000; }


Generated: Tue May 19 15:51:04 2020 Cross-referenced by PHPXref 0.7.1