[ Index ]

PHP Cross Reference of WordPress Trunk (Updated Daily)

Search

title

Body

[close]

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

   1  @charset "UTF-8";
   2  /**
   3   * Colors
   4   */
   5  /**
   6   * Breakpoints & Media Queries
   7   */
   8  /**
   9   * SCSS Variables.
  10   *
  11   * Please use variables from this sheet to ensure consistency across the UI.
  12   * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
  13   * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
  14   */
  15  /**
  16   * Colors
  17   */
  18  /**
  19   * Fonts & basic variables.
  20   */
  21  /**
  22   * Grid System.
  23   * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  24   */
  25  /**
  26   * Dimensions.
  27   */
  28  /**
  29   * Shadows.
  30   */
  31  /**
  32   * Editor widths.
  33   */
  34  /**
  35   * Block & Editor UI.
  36   */
  37  /**
  38   * Block paddings.
  39   */
  40  /**
  41   * React Native specific.
  42   * These variables do not appear to be used anywhere else.
  43   */
  44  /**
  45   * Breakpoint mixins
  46   */
  47  /**
  48   * Long content fade mixin
  49   *
  50   * Creates a fading overlay to signify that the content is longer
  51   * than the space allows.
  52   */
  53  /**
  54   * Focus styles.
  55   */
  56  /**
  57   * Applies editor left position to the selector passed as argument
  58   */
  59  /**
  60   * Styles that are reused verbatim in a few places
  61   */
  62  /**
  63   * Allows users to opt-out of animations via OS-level preferences.
  64   */
  65  /**
  66   * Reset default styles for JavaScript UI based pages.
  67   * This is a WP-admin agnostic reset
  68   */
  69  /**
  70   * Reset the WP Admin page styles for Gutenberg-like pages.
  71   */
  72  :root {
  73    --wp-admin-theme-color: #007cba;
  74    --wp-admin-theme-color-darker-10: #006ba1;
  75    --wp-admin-theme-color-darker-20: #005a87;
  76    --wp-admin-border-width-focus: 2px;
  77  }
  78  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  79    :root {
  80      --wp-admin-border-width-focus: 1.5px;
  81    }
  82  }
  83  
  84  .components-animate__appear {
  85    animation: components-animate__appear-animation 0.1s cubic-bezier(0, 0, 0.2, 1) 0s;
  86    animation-fill-mode: forwards;
  87  }
  88  @media (prefers-reduced-motion: reduce) {
  89    .components-animate__appear {
  90      animation-duration: 1ms;
  91      animation-delay: 0s;
  92    }
  93  }
  94  .components-animate__appear.is-from-top, .components-animate__appear.is-from-top.is-from-left {
  95    transform-origin: top left;
  96  }
  97  .components-animate__appear.is-from-top.is-from-right {
  98    transform-origin: top right;
  99  }
 100  .components-animate__appear.is-from-bottom, .components-animate__appear.is-from-bottom.is-from-left {
 101    transform-origin: bottom left;
 102  }
 103  .components-animate__appear.is-from-bottom.is-from-right {
 104    transform-origin: bottom right;
 105  }
 106  
 107  @keyframes components-animate__appear-animation {
 108    from {
 109      transform: translateY(-2em) scaleY(0) scaleX(0);
 110    }
 111    to {
 112      transform: translateY(0%) scaleY(1) scaleX(1);
 113    }
 114  }
 115  .components-animate__slide-in {
 116    animation: components-animate__slide-in-animation 0.1s cubic-bezier(0, 0, 0.2, 1);
 117    animation-fill-mode: forwards;
 118  }
 119  @media (prefers-reduced-motion: reduce) {
 120    .components-animate__slide-in {
 121      animation-duration: 1ms;
 122      animation-delay: 0s;
 123    }
 124  }
 125  .components-animate__slide-in.is-from-left {
 126    transform: translateX(100%);
 127  }
 128  .components-animate__slide-in.is-from-right {
 129    transform: translateX(-100%);
 130  }
 131  
 132  @keyframes components-animate__slide-in-animation {
 133    100% {
 134      transform: translateX(0%);
 135    }
 136  }
 137  .components-animate__loading {
 138    animation: components-animate__loading 1.6s ease-in-out infinite;
 139  }
 140  
 141  @keyframes components-animate__loading {
 142    0% {
 143      opacity: 0.5;
 144    }
 145    50% {
 146      opacity: 1;
 147    }
 148    100% {
 149      opacity: 0.5;
 150    }
 151  }
 152  .components-autocomplete__popover .components-popover__content > div {
 153    padding: 16px;
 154    min-width: 220px;
 155  }
 156  
 157  .components-autocomplete__result.components-button {
 158    display: flex;
 159    height: auto;
 160    min-height: 36px;
 161    text-align: left;
 162    width: 100%;
 163  }
 164  .components-autocomplete__result.components-button.is-selected {
 165    box-shadow: 0 0 0 2px var(--wp-admin-theme-color);
 166  }
 167  
 168  .components-button-group {
 169    display: inline-block;
 170  }
 171  .components-button-group .components-button {
 172    border-radius: 0;
 173    display: inline-flex;
 174    color: #1e1e1e;
 175    box-shadow: inset 0 0 0 1px #1e1e1e;
 176  }
 177  .components-button-group .components-button + .components-button {
 178    margin-left: -1px;
 179  }
 180  .components-button-group .components-button:first-child {
 181    border-radius: 2px 0 0 2px;
 182  }
 183  .components-button-group .components-button:last-child {
 184    border-radius: 0 2px 2px 0;
 185  }
 186  .components-button-group .components-button:focus, .components-button-group .components-button.is-primary {
 187    position: relative;
 188    z-index: 1;
 189  }
 190  .components-button-group .components-button.is-primary {
 191    box-shadow: inset 0 0 0 1px #1e1e1e;
 192  }
 193  
 194  .components-button {
 195    display: inline-flex;
 196    text-decoration: none;
 197    font-weight: normal;
 198    font-size: 13px;
 199    margin: 0;
 200    border: 0;
 201    cursor: pointer;
 202    -webkit-appearance: none;
 203    background: none;
 204    transition: box-shadow 0.1s linear;
 205    height: 36px;
 206    align-items: center;
 207    box-sizing: border-box;
 208    padding: 6px 12px;
 209    border-radius: 2px;
 210    color: #1e1e1e;
 211    /**
 212     * Primary button style.
 213     */
 214    /**
 215     * Secondary and tertiary buttons.
 216     */
 217    /**
 218     * Secondary button style.
 219     */
 220    /**
 221     * Tertiary buttons.
 222     */
 223    /**
 224     * Destructive buttons.
 225     */
 226    /**
 227     * Link buttons.
 228     */
 229  }
 230  @media (prefers-reduced-motion: reduce) {
 231    .components-button {
 232      transition-duration: 0s;
 233      transition-delay: 0s;
 234    }
 235  }
 236  .components-button[aria-expanded=true], .components-button:hover {
 237    color: var(--wp-admin-theme-color);
 238  }
 239  .components-button[aria-disabled=true]:hover {
 240    color: initial;
 241  }
 242  .components-button:focus:not(:disabled) {
 243    box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 244    outline: 3px solid transparent;
 245  }
 246  .components-button.is-primary {
 247    white-space: nowrap;
 248    background: var(--wp-admin-theme-color);
 249    color: #fff;
 250    text-decoration: none;
 251    text-shadow: none;
 252    outline: 1px solid transparent;
 253  }
 254  .components-button.is-primary:hover:not(:disabled) {
 255    background: var(--wp-admin-theme-color-darker-10);
 256    color: #fff;
 257  }
 258  .components-button.is-primary:active:not(:disabled) {
 259    background: var(--wp-admin-theme-color-darker-20);
 260    border-color: var(--wp-admin-theme-color-darker-20);
 261    color: #fff;
 262  }
 263  .components-button.is-primary:focus:not(:disabled) {
 264    box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 265  }
 266  .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 {
 267    color: rgba(255, 255, 255, 0.4);
 268    background: var(--wp-admin-theme-color);
 269    border-color: var(--wp-admin-theme-color);
 270    opacity: 1;
 271    outline: none;
 272  }
 273  .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 {
 274    box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--wp-admin-theme-color);
 275  }
 276  .components-button.is-primary.is-busy, .components-button.is-primary.is-busy:disabled, .components-button.is-primary.is-busy[aria-disabled=true] {
 277    color: #fff;
 278    background-size: 100px 100%;
 279    /* stylelint-disable */
 280    background-image: linear-gradient(-45deg, var(--wp-admin-theme-color) 33%, var(--wp-admin-theme-color-darker-20) 33%, var(--wp-admin-theme-color-darker-20) 70%, var(--wp-admin-theme-color) 70%);
 281    /* stylelint-enable */
 282    border-color: var(--wp-admin-theme-color);
 283  }
 284  .components-button.is-secondary, .components-button.is-tertiary {
 285    outline: 1px solid transparent;
 286  }
 287  .components-button.is-secondary:active:not(:disabled), .components-button.is-tertiary:active:not(:disabled) {
 288    background: #ddd;
 289    color: var(--wp-admin-theme-color-darker-10);
 290    box-shadow: none;
 291  }
 292  .components-button.is-secondary:hover:not(:disabled), .components-button.is-tertiary:hover:not(:disabled) {
 293    color: var(--wp-admin-theme-color-darker-10);
 294    box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color-darker-10);
 295  }
 296  .components-button.is-secondary:disabled, .components-button.is-secondary[aria-disabled=true], .components-button.is-secondary[aria-disabled=true]:hover, .components-button.is-tertiary:disabled, .components-button.is-tertiary[aria-disabled=true], .components-button.is-tertiary[aria-disabled=true]:hover {
 297    color: #828282;
 298    background: #eaeaea;
 299    transform: none;
 300    opacity: 1;
 301    box-shadow: none;
 302    outline: none;
 303  }
 304  .components-button.is-secondary {
 305    box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color);
 306    outline: 1px solid transparent;
 307    white-space: nowrap;
 308    color: var(--wp-admin-theme-color);
 309    background: transparent;
 310  }
 311  .components-button.is-tertiary {
 312    white-space: nowrap;
 313    color: var(--wp-admin-theme-color);
 314    background: transparent;
 315    padding: 6px;
 316  }
 317  .components-button.is-tertiary .dashicon {
 318    display: inline-block;
 319    flex: 0 0 auto;
 320  }
 321  .components-button.is-destructive {
 322    color: #cc1818;
 323    box-shadow: inset 0 0 0 1px #cc1818;
 324  }
 325  .components-button.is-destructive:hover:not(:disabled) {
 326    color: #710d0d;
 327    box-shadow: inset 0 0 0 1px #710d0d;
 328  }
 329  .components-button.is-destructive:focus:not(:disabled) {
 330    color: var(--wp-admin-theme-color);
 331  }
 332  .components-button.is-destructive:active:not(:disabled) {
 333    background: #ccc;
 334  }
 335  .components-button.is-destructive.is-primary {
 336    color: #fff;
 337    background: #cc1818;
 338    box-shadow: inset 0 0 0 1px #cc1818;
 339  }
 340  .components-button.is-destructive.is-primary:hover:not(:disabled) {
 341    color: #fff;
 342    background: #710d0d;
 343    box-shadow: inset 0 0 0 1px #710d0d;
 344  }
 345  .components-button.is-link {
 346    margin: 0;
 347    padding: 0;
 348    box-shadow: none;
 349    border: 0;
 350    border-radius: 0;
 351    background: none;
 352    outline: none;
 353    text-align: left;
 354    color: var(--wp-admin-theme-color);
 355    text-decoration: underline;
 356    transition-property: border, background, color;
 357    transition-duration: 0.05s;
 358    transition-timing-function: ease-in-out;
 359    height: auto;
 360  }
 361  @media (prefers-reduced-motion: reduce) {
 362    .components-button.is-link {
 363      transition-duration: 0s;
 364      transition-delay: 0s;
 365    }
 366  }
 367  .components-button.is-link:focus {
 368    border-radius: 2px;
 369  }
 370  .components-button.is-link.is-destructive {
 371    color: #cc1818;
 372  }
 373  .components-button.is-link.is-destructive:active:not(:disabled), .components-button.is-link.is-destructive:hover:not(:disabled) {
 374    color: #710d0d;
 375    background: none;
 376  }
 377  .components-button.is-link.is-destructive:focus:not(:disabled) {
 378    color: var(--wp-admin-theme-color);
 379  }
 380  .components-button:not([aria-disabled=true]):active {
 381    color: inherit;
 382  }
 383  .components-button:disabled, .components-button[aria-disabled=true] {
 384    cursor: default;
 385    opacity: 0.3;
 386  }
 387  .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] {
 388    animation: components-button__busy-animation 2500ms infinite linear;
 389    opacity: 1;
 390    background-size: 100px 100%;
 391    /* stylelint-disable */
 392    background-image: linear-gradient(-45deg, #fafafa 33%, #e0e0e0 33%, #e0e0e0 70%, #fafafa 70%);
 393    /* stylelint-enable */
 394  }
 395  .components-button.is-small {
 396    height: 24px;
 397    line-height: 22px;
 398    padding: 0 8px;
 399    font-size: 11px;
 400  }
 401  .components-button.is-small.has-icon:not(.has-text) {
 402    padding: 0 8px;
 403    width: 24px;
 404  }
 405  .components-button.has-icon {
 406    padding: 6px;
 407    min-width: 36px;
 408    justify-content: center;
 409  }
 410  .components-button.has-icon .dashicon {
 411    display: inline-block;
 412    flex: 0 0 auto;
 413    margin-left: 2px;
 414    margin-right: 2px;
 415  }
 416  .components-button.has-icon.has-text {
 417    justify-content: left;
 418  }
 419  .components-button.has-icon.has-text svg {
 420    margin-right: 8px;
 421  }
 422  .components-button.has-icon.has-text .dashicon {
 423    margin-right: 10px;
 424  }
 425  .components-button.is-pressed {
 426    color: #fff;
 427    background: #1e1e1e;
 428  }
 429  .components-button.is-pressed:focus:not(:disabled) {
 430    box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 431    outline: 2px solid transparent;
 432  }
 433  .components-button.is-pressed:hover:not(:disabled) {
 434    color: #fff;
 435    background: #1e1e1e;
 436  }
 437  .components-button svg {
 438    fill: currentColor;
 439    outline: none;
 440  }
 441  .components-button .components-visually-hidden {
 442    height: auto;
 443  }
 444  
 445  @keyframes components-button__busy-animation {
 446    0% {
 447      background-position: 200px 0;
 448    }
 449  }
 450  .components-checkbox-control__input[type=checkbox] {
 451    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 452    padding: 6px 8px;
 453    box-shadow: 0 0 0 transparent;
 454    transition: box-shadow 0.1s linear;
 455    border-radius: 2px;
 456    border: 1px solid #757575;
 457    /* Fonts smaller than 16px causes mobile safari to zoom. */
 458    font-size: 16px;
 459    /* Override core line-height. To be reviewed. */
 460    line-height: normal;
 461    border: 1px solid #1e1e1e;
 462    margin-right: 12px;
 463    transition: none;
 464    border-radius: 2px;
 465    background: #fff;
 466    color: #1e1e1e;
 467    clear: none;
 468    cursor: pointer;
 469    display: inline-block;
 470    line-height: 0;
 471    margin: 0 4px 0 0;
 472    outline: 0;
 473    padding: 0 !important;
 474    text-align: center;
 475    vertical-align: top;
 476    width: 24px;
 477    height: 24px;
 478    -webkit-appearance: none;
 479            appearance: none;
 480    transition: 0.1s border-color ease-in-out;
 481  }
 482  @media (prefers-reduced-motion: reduce) {
 483    .components-checkbox-control__input[type=checkbox] {
 484      transition-duration: 0s;
 485      transition-delay: 0s;
 486    }
 487  }
 488  @media (min-width: 600px) {
 489    .components-checkbox-control__input[type=checkbox] {
 490      font-size: 13px;
 491      /* Override core line-height. To be reviewed. */
 492      line-height: normal;
 493    }
 494  }
 495  .components-checkbox-control__input[type=checkbox]:focus {
 496    border-color: var(--wp-admin-theme-color);
 497    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
 498    outline: 2px solid transparent;
 499  }
 500  .components-checkbox-control__input[type=checkbox]::-webkit-input-placeholder {
 501    color: rgba(30, 30, 30, 0.62);
 502  }
 503  .components-checkbox-control__input[type=checkbox]::-moz-placeholder {
 504    opacity: 1;
 505    color: rgba(30, 30, 30, 0.62);
 506  }
 507  .components-checkbox-control__input[type=checkbox]:-ms-input-placeholder {
 508    color: rgba(30, 30, 30, 0.62);
 509  }
 510  .components-checkbox-control__input[type=checkbox]:focus {
 511    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
 512    outline: 2px solid transparent;
 513  }
 514  .components-checkbox-control__input[type=checkbox]:checked {
 515    background: var(--wp-admin-theme-color);
 516    border-color: var(--wp-admin-theme-color);
 517  }
 518  .components-checkbox-control__input[type=checkbox]:checked::-ms-check {
 519    opacity: 0;
 520  }
 521  .components-checkbox-control__input[type=checkbox]:checked::before, .components-checkbox-control__input[type=checkbox][aria-checked=mixed]::before {
 522    margin: -3px -5px;
 523    color: #fff;
 524  }
 525  @media (min-width: 782px) {
 526    .components-checkbox-control__input[type=checkbox]:checked::before, .components-checkbox-control__input[type=checkbox][aria-checked=mixed]::before {
 527      margin: -4px 0 0 -5px;
 528    }
 529  }
 530  .components-checkbox-control__input[type=checkbox][aria-checked=mixed] {
 531    background: var(--wp-admin-theme-color);
 532    border-color: var(--wp-admin-theme-color);
 533  }
 534  .components-checkbox-control__input[type=checkbox][aria-checked=mixed]::before {
 535    content: "";
 536    float: left;
 537    display: inline-block;
 538    vertical-align: middle;
 539    width: 16px;
 540    /* stylelint-disable */
 541    font: normal 30px/1 dashicons;
 542    /* stylelint-enable */
 543    speak: none;
 544    -webkit-font-smoothing: antialiased;
 545    -moz-osx-font-smoothing: grayscale;
 546  }
 547  @media (min-width: 782px) {
 548    .components-checkbox-control__input[type=checkbox][aria-checked=mixed]::before {
 549      float: none;
 550      font-size: 21px;
 551    }
 552  }
 553  @media (min-width: 600px) {
 554    .components-checkbox-control__input[type=checkbox] {
 555      height: 20px;
 556      width: 20px;
 557    }
 558  }
 559  @media (prefers-reduced-motion: reduce) {
 560    .components-checkbox-control__input[type=checkbox] {
 561      transition-duration: 0s;
 562      transition-delay: 0s;
 563    }
 564  }
 565  .components-checkbox-control__input[type=checkbox]:focus {
 566    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
 567    outline: 2px solid transparent;
 568  }
 569  .components-checkbox-control__input[type=checkbox]:checked {
 570    background: var(--wp-admin-theme-color);
 571    border-color: var(--wp-admin-theme-color);
 572  }
 573  .components-checkbox-control__input[type=checkbox]:checked::-ms-check {
 574    opacity: 0;
 575  }
 576  .components-checkbox-control__input[type=checkbox]:checked::before {
 577    content: none;
 578  }
 579  
 580  .components-checkbox-control__input-container {
 581    position: relative;
 582    display: inline-block;
 583    margin-right: 12px;
 584    vertical-align: middle;
 585    width: 24px;
 586    height: 24px;
 587  }
 588  @media (min-width: 600px) {
 589    .components-checkbox-control__input-container {
 590      width: 20px;
 591      height: 20px;
 592    }
 593  }
 594  
 595  svg.components-checkbox-control__checked {
 596    fill: #fff;
 597    cursor: pointer;
 598    position: absolute;
 599    left: 0;
 600    top: 0;
 601    width: 24px;
 602    height: 24px;
 603    -webkit-user-select: none;
 604            user-select: none;
 605    pointer-events: none;
 606  }
 607  @media (min-width: 600px) {
 608    svg.components-checkbox-control__checked {
 609      left: -2px;
 610      top: -2px;
 611    }
 612  }
 613  
 614  .components-circular-option-picker {
 615    display: inline-block;
 616    width: 100%;
 617    min-width: 188px;
 618  }
 619  .components-circular-option-picker .components-circular-option-picker__custom-clear-wrapper {
 620    display: flex;
 621    justify-content: flex-end;
 622  }
 623  .components-circular-option-picker .components-circular-option-picker__swatches {
 624    margin-right: -12px;
 625  }
 626  
 627  .components-circular-option-picker__option-wrapper {
 628    display: inline-block;
 629    height: 28px;
 630    width: 28px;
 631    margin-right: 12px;
 632    margin-bottom: 12px;
 633    vertical-align: top;
 634    transform: scale(1);
 635    transition: 100ms transform ease;
 636  }
 637  @media (prefers-reduced-motion: reduce) {
 638    .components-circular-option-picker__option-wrapper {
 639      transition-duration: 0s;
 640      transition-delay: 0s;
 641    }
 642  }
 643  .components-circular-option-picker__option-wrapper:hover {
 644    transform: scale(1.2);
 645  }
 646  .components-circular-option-picker__option-wrapper > div {
 647    height: 100%;
 648    width: 100%;
 649  }
 650  
 651  .components-circular-option-picker__option-wrapper::before {
 652    content: "";
 653    position: absolute;
 654    top: 1px;
 655    left: 1px;
 656    bottom: 1px;
 657    right: 1px;
 658    border-radius: 50%;
 659    z-index: -1;
 660    /* stylelint-disable-next-line function-url-quotes */
 661    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');
 662  }
 663  
 664  .components-circular-option-picker__option {
 665    display: inline-block;
 666    vertical-align: top;
 667    height: 100%;
 668    width: 100%;
 669    border: none;
 670    border-radius: 50%;
 671    background: transparent;
 672    box-shadow: inset 0 0 0 14px;
 673    transition: 100ms box-shadow ease;
 674    cursor: pointer;
 675  }
 676  @media (prefers-reduced-motion: reduce) {
 677    .components-circular-option-picker__option {
 678      transition-duration: 0s;
 679      transition-delay: 0s;
 680    }
 681  }
 682  .components-circular-option-picker__option:hover {
 683    box-shadow: inset 0 0 0 14px !important;
 684  }
 685  .components-circular-option-picker__option.is-pressed {
 686    box-shadow: inset 0 0 0 4px;
 687    position: relative;
 688    z-index: 1;
 689    overflow: visible;
 690  }
 691  .components-circular-option-picker__option.is-pressed + svg {
 692    position: absolute;
 693    left: 2px;
 694    top: 2px;
 695    border-radius: 50%;
 696    z-index: 2;
 697    pointer-events: none;
 698  }
 699  .components-circular-option-picker__option::after {
 700    content: "";
 701    position: absolute;
 702    top: -1px;
 703    left: -1px;
 704    bottom: -1px;
 705    right: -1px;
 706    border-radius: 50%;
 707    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
 708    border: 1px solid transparent;
 709  }
 710  .components-circular-option-picker__option:focus::after {
 711    content: "";
 712    border: 2px solid #757575;
 713    width: 32px;
 714    height: 32px;
 715    position: absolute;
 716    top: -2px;
 717    left: -2px;
 718    border-radius: 50%;
 719    box-shadow: inset 0 0 0 2px #fff;
 720  }
 721  .components-circular-option-picker__option.components-button:focus {
 722    background-color: transparent;
 723    box-shadow: inset 0 0 0 14px;
 724    outline: none;
 725  }
 726  
 727  .components-circular-option-picker__button-action .components-circular-option-picker__option {
 728    color: #fff;
 729    background: #fff;
 730  }
 731  
 732  .components-circular-option-picker__dropdown-link-action {
 733    margin-right: 16px;
 734  }
 735  .components-circular-option-picker__dropdown-link-action .components-button {
 736    line-height: 22px;
 737  }
 738  
 739  .components-color-edit__color-option-main-area {
 740    display: flex;
 741    align-items: center;
 742  }
 743  .components-color-edit__color-option-main-area div.components-circular-option-picker__option-wrapper {
 744    display: block;
 745    margin: 8px;
 746  }
 747  
 748  .components-color-edit__color-option.is-hover {
 749    background: #e0e0e0;
 750  }
 751  
 752  .components-color-edit__cancel-button {
 753    float: right;
 754  }
 755  
 756  .components-color-edit__color-option-color-name {
 757    width: 100%;
 758  }
 759  
 760  .components-color-edit__label-and-insert-container {
 761    display: flex;
 762    align-items: center;
 763    justify-content: space-between;
 764  }
 765  
 766  .components-color-edit__insert-button {
 767    margin-top: -8px;
 768  }
 769  
 770  .components-color-edit__hidden-control {
 771    position: relative;
 772    left: -9999px;
 773  }
 774  
 775  .components-color-edit__color-option-color-name-input .components-base-control__field {
 776    margin-bottom: 0;
 777    margin-right: 8px;
 778  }
 779  
 780  .components-color-edit__slug-input {
 781    margin-left: 8px;
 782  }
 783  
 784  .components-color-edit__reset-button {
 785    float: right;
 786  }
 787  
 788  .component-color-indicator {
 789    width: 25px;
 790    height: 16px;
 791    margin-left: 0.8rem;
 792    border: 1px solid #dadada;
 793    display: inline-block;
 794  }
 795  .component-color-indicator + .component-color-indicator {
 796    margin-left: 0.5rem;
 797  }
 798  
 799  /**
 800   * Parts of this source were derived and modified from react-color,
 801   * released under the MIT license.
 802   *
 803   * https://github.com/casesandberg/react-color/
 804   *
 805   * Copyright (c) 2015 Case Sandberg
 806   *
 807   * Permission is hereby granted, free of charge, to any person obtaining a copy
 808   * of this software and associated documentation files (the "Software"), to deal
 809   * in the Software without restriction, including without limitation the rights
 810   * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 811   * copies of the Software, and to permit persons to whom the Software is
 812   * furnished to do so, subject to the following conditions:
 813   *
 814   * The above copyright notice and this permission notice shall be included in
 815   * all copies or substantial portions of the Software.
 816   *
 817   * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 818   * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 819   * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 820   * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 821   * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 822   * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 823   * THE SOFTWARE.
 824   */
 825  .components-color-picker {
 826    width: 100%;
 827  }
 828  .components-color-picker * {
 829    box-sizing: border-box;
 830  }
 831  
 832  .components-color-picker__saturation {
 833    width: 100%;
 834    padding-bottom: 55%;
 835    position: relative;
 836  }
 837  
 838  .components-color-picker__body {
 839    padding: 16px 16px 12px;
 840  }
 841  
 842  .components-color-picker__controls {
 843    display: flex;
 844  }
 845  
 846  .components-color-picker__saturation-pointer,
 847  .components-color-picker__hue-pointer,
 848  .components-color-picker__alpha-pointer {
 849    padding: 0;
 850    position: absolute;
 851    cursor: pointer;
 852    box-shadow: none;
 853    border: none;
 854  }
 855  
 856  /* CURRENT COLOR COMPONENT */
 857  .components-color-picker__swatch {
 858    margin-right: 8px;
 859    width: 32px;
 860    height: 32px;
 861    border-radius: 50%;
 862    position: relative;
 863    overflow: hidden;
 864    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%);
 865    background-size: 10px 10px;
 866    background-position: 0 0, 0 5px, 5px -5px, -5px 0;
 867  }
 868  .is-alpha-disabled .components-color-picker__swatch {
 869    width: 12px;
 870    height: 12px;
 871    margin-top: 0;
 872  }
 873  
 874  .components-color-picker__active {
 875    position: absolute;
 876    top: 0;
 877    left: 0;
 878    right: 0;
 879    bottom: 0;
 880    border-radius: 50%;
 881    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
 882    z-index: 2;
 883  }
 884  
 885  /* SATURATION COMPONENT */
 886  .components-color-picker__saturation-color,
 887  .components-color-picker__saturation-white,
 888  .components-color-picker__saturation-black {
 889    position: absolute;
 890    top: 0;
 891    left: 0;
 892    right: 0;
 893    bottom: 0;
 894  }
 895  
 896  .components-color-picker__saturation-color {
 897    overflow: visible;
 898  }
 899  
 900  .components-color-picker__saturation-white {
 901    /*rtl:ignore*/
 902    background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
 903  }
 904  
 905  .components-color-picker__saturation-black {
 906    background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));
 907  }
 908  
 909  .components-button.components-color-picker__saturation-pointer {
 910    width: 14px;
 911    height: 14px;
 912    padding: 0;
 913    border-radius: 50%;
 914    background-color: transparent;
 915    transform: translate(-50%, -50%);
 916    box-shadow: 0 0 0 1px #fff, inset 0 0 0 1px #000, 0 0 0 2px #000;
 917  }
 918  .components-button.components-color-picker__saturation-pointer:focus:not(:disabled) {
 919    box-shadow: 0 0 0 2px #fff, inset 0 0 0 1px #000, 0 0 0 3px #000;
 920  }
 921  
 922  /* HUE & ALPHA BARS */
 923  .components-color-picker__toggles {
 924    flex: 1;
 925  }
 926  
 927  .components-color-picker__alpha {
 928    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%);
 929    background-size: 10px 10px;
 930    background-position: 0 0, 0 5px, 5px -5px, -5px 0;
 931  }
 932  
 933  .components-color-picker__hue-gradient,
 934  .components-color-picker__alpha-gradient {
 935    position: absolute;
 936    top: 0;
 937    left: 0;
 938    right: 0;
 939    bottom: 0;
 940  }
 941  
 942  .components-color-picker__hue,
 943  .components-color-picker__alpha {
 944    height: 12px;
 945    position: relative;
 946  }
 947  
 948  .is-alpha-enabled .components-color-picker__hue {
 949    margin-bottom: 8px;
 950  }
 951  
 952  .components-color-picker__hue-bar,
 953  .components-color-picker__alpha-bar {
 954    position: relative;
 955    margin: 0 3px;
 956    height: 100%;
 957    padding: 0 2px;
 958  }
 959  
 960  .components-color-picker__hue-gradient {
 961    /*rtl:ignore*/
 962    background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);
 963  }
 964  
 965  .components-color-picker__hue-pointer,
 966  .components-color-picker__alpha-pointer {
 967    /*rtl:ignore*/
 968    left: 0;
 969    width: 14px;
 970    height: 14px;
 971    border-radius: 50%;
 972    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37);
 973    background: #fff;
 974    transform: translate(-7px, -1px);
 975  }
 976  
 977  .components-color-picker__hue-pointer,
 978  .components-color-picker__saturation-pointer {
 979    transition: box-shadow 0.1s linear;
 980  }
 981  @media (prefers-reduced-motion: reduce) {
 982    .components-color-picker__hue-pointer,
 983  .components-color-picker__saturation-pointer {
 984      transition-duration: 0s;
 985      transition-delay: 0s;
 986    }
 987  }
 988  
 989  .components-color-picker__saturation-pointer:focus {
 990    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color), 0 0 5px 0 var(--wp-admin-theme-color), inset 0 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px 2px rgba(0, 0, 0, 0.4);
 991  }
 992  
 993  .components-color-picker__hue-pointer:focus,
 994  .components-color-picker__alpha-pointer:focus {
 995    border-color: var(--wp-admin-theme-color);
 996    box-shadow: 0 0 0 2px var(--wp-admin-theme-color), 0 0 3px 0 var(--wp-admin-theme-color);
 997    outline: 2px solid transparent;
 998    outline-offset: -2px;
 999  }
1000  
1001  /* INPUTS COMPONENT */
1002  .components-color-picker__inputs-wrapper {
1003    margin: 0 -4px;
1004    padding-top: 16px;
1005    display: flex;
1006    align-items: flex-end;
1007    min-width: 255px;
1008  }
1009  .components-color-picker__inputs-wrapper fieldset {
1010    flex: 1;
1011    border: none;
1012    margin: 0;
1013    padding: 0;
1014  }
1015  .components-color-picker__inputs-wrapper .components-color-picker__inputs-fields .components-text-control__input[type=number] {
1016    padding: 6px 3px;
1017    margin: 0;
1018  }
1019  
1020  .components-color-picker__inputs-field {
1021    width: 100%;
1022  }
1023  
1024  .components-color-picker__inputs-fields {
1025    display: flex;
1026    /*rtl:ignore*/
1027    direction: ltr;
1028    flex-grow: 1;
1029    margin-right: 4px;
1030  }
1031  .components-color-picker__inputs-fields .components-base-control + .components-base-control {
1032    margin-top: 0;
1033  }
1034  .components-color-picker__inputs-fields .components-base-control__field {
1035    margin: 0 2px;
1036  }
1037  
1038  .components-color-picker__inputs-toggle {
1039    height: 30px;
1040    padding: 0 5px;
1041  }
1042  
1043  .components-combobox-control {
1044    width: 100%;
1045  }
1046  
1047  input.components-combobox-control__input[type=text] {
1048    width: 100%;
1049    border: none;
1050    box-shadow: none;
1051    font-size: 16px;
1052    padding: 2px;
1053    margin: 0;
1054    line-height: inherit;
1055    min-height: auto;
1056  }
1057  @media (min-width: 600px) {
1058    input.components-combobox-control__input[type=text] {
1059      font-size: 13px;
1060    }
1061  }
1062  input.components-combobox-control__input[type=text]:focus {
1063    outline: none;
1064    box-shadow: none;
1065  }
1066  
1067  .components-combobox-control__suggestions-container {
1068    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1069    padding: 6px 8px;
1070    box-shadow: 0 0 0 transparent;
1071    transition: box-shadow 0.1s linear;
1072    border-radius: 2px;
1073    border: 1px solid #757575;
1074    /* Fonts smaller than 16px causes mobile safari to zoom. */
1075    font-size: 16px;
1076    /* Override core line-height. To be reviewed. */
1077    line-height: normal;
1078    display: flex;
1079    flex-wrap: wrap;
1080    align-items: flex-start;
1081    width: 100%;
1082    margin: 0 0 8px 0;
1083    padding: 4px;
1084  }
1085  @media (prefers-reduced-motion: reduce) {
1086    .components-combobox-control__suggestions-container {
1087      transition-duration: 0s;
1088      transition-delay: 0s;
1089    }
1090  }
1091  @media (min-width: 600px) {
1092    .components-combobox-control__suggestions-container {
1093      font-size: 13px;
1094      /* Override core line-height. To be reviewed. */
1095      line-height: normal;
1096    }
1097  }
1098  .components-combobox-control__suggestions-container:focus {
1099    border-color: var(--wp-admin-theme-color);
1100    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
1101    outline: 2px solid transparent;
1102  }
1103  .components-combobox-control__suggestions-container::-webkit-input-placeholder {
1104    color: rgba(30, 30, 30, 0.62);
1105  }
1106  .components-combobox-control__suggestions-container::-moz-placeholder {
1107    opacity: 1;
1108    color: rgba(30, 30, 30, 0.62);
1109  }
1110  .components-combobox-control__suggestions-container:-ms-input-placeholder {
1111    color: rgba(30, 30, 30, 0.62);
1112  }
1113  .components-combobox-control__suggestions-container:focus-within {
1114    border-color: var(--wp-admin-theme-color);
1115    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
1116    outline: 2px solid transparent;
1117  }
1118  
1119  .components-combobox-control__reset.components-button {
1120    display: flex;
1121    height: 24px;
1122    min-width: 24px;
1123    padding: 0;
1124  }
1125  
1126  .components-color-list-picker,
1127  .components-color-list-picker__swatch-button {
1128    width: 100%;
1129  }
1130  
1131  .components-custom-gradient-picker__gradient-bar:not(.has-gradient) {
1132    opacity: 0.4;
1133  }
1134  
1135  .components-custom-gradient-picker__gradient-bar {
1136    margin-top: 12px;
1137    width: 100%;
1138    height: 36px;
1139    border-radius: 36px;
1140    margin-bottom: 12px;
1141    padding-left: 6px;
1142    padding-right: 30px;
1143  }
1144  .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__markers-container {
1145    position: relative;
1146  }
1147  .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__insert-point {
1148    border-radius: 50%;
1149    background: #fff;
1150    padding: 2px;
1151    top: 6px;
1152    min-width: 24px;
1153    width: 24px;
1154    height: 24px;
1155    position: relative;
1156    color: #1e1e1e;
1157  }
1158  .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__insert-point svg {
1159    height: 100%;
1160    width: 100%;
1161  }
1162  .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button {
1163    border: 2px solid transparent;
1164    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #fff;
1165    border-radius: 50%;
1166    height: 24px;
1167    width: 24px;
1168    padding: 0;
1169    position: absolute;
1170    top: 6px;
1171  }
1172  .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button:focus, .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button.is-active {
1173    box-shadow: 0 0 0 1px #fff, 0 0 0 3px #1e1e1e;
1174  }
1175  
1176  .components-custom-gradient-picker__color-picker-popover .components-custom-gradient-picker__remove-control-point {
1177    margin-left: auto;
1178    margin-right: auto;
1179    display: block;
1180    margin-bottom: 8px;
1181  }
1182  
1183  .components-custom-gradient-picker__inserter {
1184    width: 100%;
1185  }
1186  
1187  .components-custom-gradient-picker__liner-gradient-indicator {
1188    display: inline-block;
1189    flex: 0 auto;
1190    width: 20px;
1191    height: 20px;
1192  }
1193  
1194  .components-custom-gradient-picker .components-custom-gradient-picker__ui-line {
1195    margin-bottom: 16px;
1196  }
1197  .components-custom-gradient-picker .components-custom-gradient-picker__ui-line .components-base-control.components-angle-picker,
1198  .components-custom-gradient-picker .components-custom-gradient-picker__ui-line .components-base-control.components-custom-gradient-picker__type-picker {
1199    margin-bottom: 0;
1200  }
1201  
1202  .components-custom-gradient-picker .components-custom-gradient-picker__toolbar {
1203    border: none;
1204  }
1205  .components-custom-gradient-picker .components-custom-gradient-picker__toolbar > div + div {
1206    margin-left: 1px;
1207  }
1208  .components-custom-gradient-picker .components-custom-gradient-picker__toolbar button.is-pressed > svg {
1209    background: #fff;
1210    border: 1px solid #949494;
1211    border-radius: 2px;
1212  }
1213  
1214  .components-custom-select-control {
1215    position: relative;
1216  }
1217  
1218  .components-custom-select-control__label {
1219    display: block;
1220    margin-bottom: 8px;
1221  }
1222  
1223  .components-custom-select-control__button {
1224    border: 1px solid #757575;
1225    border-radius: 2px;
1226    min-height: 30px;
1227    min-width: 130px;
1228    position: relative;
1229    text-align: left;
1230  }
1231  .components-custom-select-control__button.components-custom-select-control__button {
1232    padding-right: 24px;
1233  }
1234  .components-custom-select-control__button:focus:not(:disabled) {
1235    border-color: var(--wp-admin-theme-color);
1236    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
1237  }
1238  .components-custom-select-control__button .components-custom-select-control__button-icon {
1239    height: 100%;
1240    padding: 0;
1241    position: absolute;
1242    right: 0;
1243    top: 0;
1244  }
1245  
1246  .components-custom-select-control__menu {
1247    border: 1px solid #1e1e1e;
1248    background-color: #fff;
1249    border-radius: 2px;
1250    outline: none;
1251    transition: none;
1252    max-height: 400px;
1253    min-width: 100%;
1254    overflow: auto;
1255    padding: 0;
1256    position: absolute;
1257    z-index: 1000000;
1258  }
1259  .components-custom-select-control__menu[aria-hidden=true] {
1260    display: none;
1261  }
1262  
1263  .components-custom-select-control__item {
1264    align-items: center;
1265    display: flex;
1266    list-style-type: none;
1267    padding: 8px;
1268    cursor: default;
1269    line-height: 28px;
1270  }
1271  .components-custom-select-control__item.is-highlighted {
1272    background: #ddd;
1273  }
1274  .components-custom-select-control__item .components-custom-select-control__item-icon {
1275    margin-right: 0;
1276    margin-left: auto;
1277  }
1278  .components-custom-select-control__item:last-child {
1279    margin-bottom: 0;
1280  }
1281  
1282  /**
1283   * Parts of this source were derived and modified from react-dates,
1284   * released under the MIT license.
1285   *
1286   * https://github.com/airbnb/react-dates
1287   *
1288   * The MIT License (MIT)
1289   *
1290   * Copyright (c) 2016 Airbnb
1291   *
1292   * Permission is hereby granted, free of charge, to any person obtaining a copy
1293   * of this software and associated documentation files (the "Software"), to deal
1294   * in the Software without restriction, including without limitation the rights
1295   * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1296   * copies of the Software, and to permit persons to whom the Software is
1297   * furnished to do so, subject to the following conditions:
1298   *
1299   * The above copyright notice and this permission notice shall be included in all
1300   * copies or substantial portions of the Software.
1301   *
1302   * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1303   * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1304   * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1305   * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1306   * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1307   * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
1308   * SOFTWARE.
1309   */
1310  /*rtl:begin:ignore*/
1311  .PresetDateRangePicker_panel {
1312    padding: 0 22px 11px;
1313  }
1314  
1315  .PresetDateRangePicker_button {
1316    position: relative;
1317    height: 100%;
1318    text-align: center;
1319    background: 0 0;
1320    border: 2px solid #00a699;
1321    color: #00a699;
1322    padding: 4px 12px;
1323    margin-right: 8px;
1324    font: inherit;
1325    font-weight: 700;
1326    line-height: normal;
1327    overflow: visible;
1328    box-sizing: border-box;
1329    cursor: pointer;
1330  }
1331  
1332  .PresetDateRangePicker_button:active {
1333    outline: 0;
1334  }
1335  
1336  .PresetDateRangePicker_button__selected {
1337    color: #fff;
1338    background: #00a699;
1339  }
1340  
1341  .SingleDatePickerInput {
1342    display: inline-block;
1343    background-color: #fff;
1344  }
1345  
1346  .SingleDatePickerInput__withBorder {
1347    border-radius: 2px;
1348    border: 1px solid #dbdbdb;
1349  }
1350  
1351  .SingleDatePickerInput__rtl {
1352    direction: rtl;
1353  }
1354  
1355  .SingleDatePickerInput__disabled {
1356    background-color: #f2f2f2;
1357  }
1358  
1359  .SingleDatePickerInput__block {
1360    display: block;
1361  }
1362  
1363  .SingleDatePickerInput__showClearDate {
1364    padding-right: 30px;
1365  }
1366  
1367  .SingleDatePickerInput_clearDate {
1368    background: 0 0;
1369    border: 0;
1370    color: inherit;
1371    font: inherit;
1372    line-height: normal;
1373    overflow: visible;
1374    cursor: pointer;
1375    padding: 10px;
1376    margin: 0 10px 0 5px;
1377    position: absolute;
1378    right: 0;
1379    top: 50%;
1380    transform: translateY(-50%);
1381  }
1382  
1383  .SingleDatePickerInput_clearDate__default:focus,
1384  .SingleDatePickerInput_clearDate__default:hover {
1385    background: #dbdbdb;
1386    border-radius: 50%;
1387  }
1388  
1389  .SingleDatePickerInput_clearDate__small {
1390    padding: 6px;
1391  }
1392  
1393  .SingleDatePickerInput_clearDate__hide {
1394    visibility: hidden;
1395  }
1396  
1397  .SingleDatePickerInput_clearDate_svg {
1398    fill: #82888a;
1399    height: 12px;
1400    width: 15px;
1401    vertical-align: middle;
1402  }
1403  
1404  .SingleDatePickerInput_clearDate_svg__small {
1405    height: 9px;
1406  }
1407  
1408  .SingleDatePickerInput_calendarIcon {
1409    background: 0 0;
1410    border: 0;
1411    color: inherit;
1412    font: inherit;
1413    line-height: normal;
1414    overflow: visible;
1415    cursor: pointer;
1416    display: inline-block;
1417    vertical-align: middle;
1418    padding: 10px;
1419    margin: 0 5px 0 10px;
1420  }
1421  
1422  .SingleDatePickerInput_calendarIcon_svg {
1423    fill: #82888a;
1424    height: 15px;
1425    width: 14px;
1426    vertical-align: middle;
1427  }
1428  
1429  .SingleDatePicker {
1430    position: relative;
1431    display: inline-block;
1432  }
1433  
1434  .SingleDatePicker__block {
1435    display: block;
1436  }
1437  
1438  .SingleDatePicker_picker {
1439    z-index: 1;
1440    background-color: #fff;
1441    position: absolute;
1442  }
1443  
1444  .SingleDatePicker_picker__rtl {
1445    direction: rtl;
1446  }
1447  
1448  .SingleDatePicker_picker__directionLeft {
1449    left: 0;
1450  }
1451  
1452  .SingleDatePicker_picker__directionRight {
1453    right: 0;
1454  }
1455  
1456  .SingleDatePicker_picker__portal {
1457    background-color: rgba(0, 0, 0, 0.3);
1458    position: fixed;
1459    top: 0;
1460    left: 0;
1461    height: 100%;
1462    width: 100%;
1463  }
1464  
1465  .SingleDatePicker_picker__fullScreenPortal {
1466    background-color: #fff;
1467  }
1468  
1469  .SingleDatePicker_closeButton {
1470    background: 0 0;
1471    border: 0;
1472    color: inherit;
1473    font: inherit;
1474    line-height: normal;
1475    overflow: visible;
1476    cursor: pointer;
1477    position: absolute;
1478    top: 0;
1479    right: 0;
1480    padding: 15px;
1481    z-index: 2;
1482  }
1483  
1484  .SingleDatePicker_closeButton:focus,
1485  .SingleDatePicker_closeButton:hover {
1486    color: #b0b3b4;
1487    text-decoration: none;
1488  }
1489  
1490  .SingleDatePicker_closeButton_svg {
1491    height: 15px;
1492    width: 15px;
1493    fill: #cacccd;
1494  }
1495  
1496  .DayPickerKeyboardShortcuts_buttonReset {
1497    background: 0 0;
1498    border: 0;
1499    border-radius: 0;
1500    color: inherit;
1501    font: inherit;
1502    line-height: normal;
1503    overflow: visible;
1504    padding: 0;
1505    cursor: pointer;
1506    font-size: 14px;
1507  }
1508  
1509  .DayPickerKeyboardShortcuts_buttonReset:active {
1510    outline: 0;
1511  }
1512  
1513  .DayPickerKeyboardShortcuts_show {
1514    width: 22px;
1515    position: absolute;
1516    z-index: 2;
1517  }
1518  
1519  .DayPickerKeyboardShortcuts_show__bottomRight {
1520    border-top: 26px solid transparent;
1521    border-right: 33px solid #00a699;
1522    bottom: 0;
1523    right: 0;
1524  }
1525  
1526  .DayPickerKeyboardShortcuts_show__bottomRight:hover {
1527    border-right: 33px solid #008489;
1528  }
1529  
1530  .DayPickerKeyboardShortcuts_show__topRight {
1531    border-bottom: 26px solid transparent;
1532    border-right: 33px solid #00a699;
1533    top: 0;
1534    right: 0;
1535  }
1536  
1537  .DayPickerKeyboardShortcuts_show__topRight:hover {
1538    border-right: 33px solid #008489;
1539  }
1540  
1541  .DayPickerKeyboardShortcuts_show__topLeft {
1542    border-bottom: 26px solid transparent;
1543    border-left: 33px solid #00a699;
1544    top: 0;
1545    left: 0;
1546  }
1547  
1548  .DayPickerKeyboardShortcuts_show__topLeft:hover {
1549    border-left: 33px solid #008489;
1550  }
1551  
1552  .DayPickerKeyboardShortcuts_showSpan {
1553    color: #fff;
1554    position: absolute;
1555  }
1556  
1557  .DayPickerKeyboardShortcuts_showSpan__bottomRight {
1558    bottom: 0;
1559    right: -28px;
1560  }
1561  
1562  .DayPickerKeyboardShortcuts_showSpan__topRight {
1563    top: 1px;
1564    right: -28px;
1565  }
1566  
1567  .DayPickerKeyboardShortcuts_showSpan__topLeft {
1568    top: 1px;
1569    left: -28px;
1570  }
1571  
1572  .DayPickerKeyboardShortcuts_panel {
1573    overflow: auto;
1574    background: #fff;
1575    border: 1px solid #dbdbdb;
1576    border-radius: 2px;
1577    position: absolute;
1578    top: 0;
1579    bottom: 0;
1580    right: 0;
1581    left: 0;
1582    z-index: 2;
1583    padding: 22px;
1584    margin: 33px;
1585  }
1586  
1587  .DayPickerKeyboardShortcuts_title {
1588    font-size: 16px;
1589    font-weight: 700;
1590    margin: 0;
1591  }
1592  
1593  .DayPickerKeyboardShortcuts_list {
1594    list-style: none;
1595    padding: 0;
1596    font-size: 14px;
1597  }
1598  
1599  .DayPickerKeyboardShortcuts_close {
1600    position: absolute;
1601    right: 22px;
1602    top: 22px;
1603    z-index: 2;
1604  }
1605  
1606  .DayPickerKeyboardShortcuts_close:active {
1607    outline: 0;
1608  }
1609  
1610  .DayPickerKeyboardShortcuts_closeSvg {
1611    height: 15px;
1612    width: 15px;
1613    fill: #cacccd;
1614  }
1615  
1616  .DayPickerKeyboardShortcuts_closeSvg:focus,
1617  .DayPickerKeyboardShortcuts_closeSvg:hover {
1618    fill: #82888a;
1619  }
1620  
1621  .CalendarDay {
1622    box-sizing: border-box;
1623    cursor: pointer;
1624    font-size: 14px;
1625    text-align: center;
1626  }
1627  
1628  .CalendarDay:active {
1629    outline: 0;
1630  }
1631  
1632  .CalendarDay__defaultCursor {
1633    cursor: default;
1634  }
1635  
1636  .CalendarDay__default {
1637    border: 1px solid #e4e7e7;
1638    color: #484848;
1639    background: #fff;
1640  }
1641  
1642  .CalendarDay__default:hover {
1643    background: #e4e7e7;
1644    border: 1px double #e4e7e7;
1645    color: inherit;
1646  }
1647  
1648  .CalendarDay__hovered_offset {
1649    background: #f4f5f5;
1650    border: 1px double #e4e7e7;
1651    color: inherit;
1652  }
1653  
1654  .CalendarDay__outside {
1655    border: 0;
1656    background: #fff;
1657    color: #484848;
1658  }
1659  
1660  .CalendarDay__outside:hover {
1661    border: 0;
1662  }
1663  
1664  .CalendarDay__blocked_minimum_nights {
1665    background: #fff;
1666    border: 1px solid #eceeee;
1667    color: #cacccd;
1668  }
1669  
1670  .CalendarDay__blocked_minimum_nights:active,
1671  .CalendarDay__blocked_minimum_nights:hover {
1672    background: #fff;
1673    color: #cacccd;
1674  }
1675  
1676  .CalendarDay__highlighted_calendar {
1677    background: #ffe8bc;
1678    color: #484848;
1679  }
1680  
1681  .CalendarDay__highlighted_calendar:active,
1682  .CalendarDay__highlighted_calendar:hover {
1683    background: #ffce71;
1684    color: #484848;
1685  }
1686  
1687  .CalendarDay__selected_span {
1688    background: #66e2da;
1689    border: 1px solid #33dacd;
1690    color: #fff;
1691  }
1692  
1693  .CalendarDay__selected_span:active,
1694  .CalendarDay__selected_span:hover {
1695    background: #33dacd;
1696    border: 1px solid #33dacd;
1697    color: #fff;
1698  }
1699  
1700  .CalendarDay__last_in_range {
1701    border-right: #00a699;
1702  }
1703  
1704  .CalendarDay__selected,
1705  .CalendarDay__selected:active,
1706  .CalendarDay__selected:hover {
1707    background: #00a699;
1708    border: 1px solid #00a699;
1709    color: #fff;
1710  }
1711  
1712  .CalendarDay__hovered_span,
1713  .CalendarDay__hovered_span:hover {
1714    background: #b2f1ec;
1715    border: 1px solid #80e8e0;
1716    color: #007a87;
1717  }
1718  
1719  .CalendarDay__hovered_span:active {
1720    background: #80e8e0;
1721    border: 1px solid #80e8e0;
1722    color: #007a87;
1723  }
1724  
1725  .CalendarDay__blocked_calendar,
1726  .CalendarDay__blocked_calendar:active,
1727  .CalendarDay__blocked_calendar:hover {
1728    background: #cacccd;
1729    border: 1px solid #cacccd;
1730    color: #82888a;
1731  }
1732  
1733  .CalendarDay__blocked_out_of_range,
1734  .CalendarDay__blocked_out_of_range:active,
1735  .CalendarDay__blocked_out_of_range:hover {
1736    background: #fff;
1737    border: 1px solid #e4e7e7;
1738    color: #cacccd;
1739  }
1740  
1741  .CalendarMonth {
1742    background: #fff;
1743    text-align: center;
1744    vertical-align: top;
1745    -webkit-user-select: none;
1746    user-select: none;
1747  }
1748  
1749  .CalendarMonth_table {
1750    border-collapse: collapse;
1751    border-spacing: 0;
1752  }
1753  
1754  .CalendarMonth_verticalSpacing {
1755    border-collapse: separate;
1756  }
1757  
1758  .CalendarMonth_caption {
1759    color: #484848;
1760    font-size: 18px;
1761    text-align: center;
1762    padding-top: 22px;
1763    padding-bottom: 37px;
1764    caption-side: initial;
1765  }
1766  
1767  .CalendarMonth_caption__verticalScrollable {
1768    padding-top: 12px;
1769    padding-bottom: 7px;
1770  }
1771  
1772  .CalendarMonthGrid {
1773    background: #fff;
1774    text-align: left;
1775    z-index: 0;
1776  }
1777  
1778  .CalendarMonthGrid__animating {
1779    z-index: 1;
1780  }
1781  
1782  .CalendarMonthGrid__horizontal {
1783    position: absolute;
1784    left: 0;
1785  }
1786  
1787  .CalendarMonthGrid__vertical {
1788    margin: 0 auto;
1789  }
1790  
1791  .CalendarMonthGrid__vertical_scrollable {
1792    margin: 0 auto;
1793    overflow-y: scroll;
1794  }
1795  
1796  .CalendarMonthGrid_month__horizontal {
1797    display: inline-block;
1798    vertical-align: top;
1799    min-height: 100%;
1800  }
1801  
1802  .CalendarMonthGrid_month__hideForAnimation {
1803    position: absolute;
1804    z-index: -1;
1805    opacity: 0;
1806    pointer-events: none;
1807  }
1808  
1809  .CalendarMonthGrid_month__hidden {
1810    visibility: hidden;
1811  }
1812  
1813  .DayPickerNavigation {
1814    position: relative;
1815    z-index: 2;
1816  }
1817  
1818  .DayPickerNavigation__horizontal {
1819    height: 0;
1820  }
1821  
1822  .DayPickerNavigation__verticalDefault {
1823    position: absolute;
1824    width: 100%;
1825    height: 52px;
1826    bottom: 0;
1827    left: 0;
1828  }
1829  
1830  .DayPickerNavigation__verticalScrollableDefault {
1831    position: relative;
1832  }
1833  
1834  .DayPickerNavigation_button {
1835    cursor: pointer;
1836    -webkit-user-select: none;
1837    user-select: none;
1838    border: 0;
1839    padding: 0;
1840    margin: 0;
1841  }
1842  
1843  .DayPickerNavigation_button__default {
1844    border: 1px solid #e4e7e7;
1845    background-color: #fff;
1846    color: #757575;
1847  }
1848  
1849  .DayPickerNavigation_button__default:focus,
1850  .DayPickerNavigation_button__default:hover {
1851    border: 1px solid #c4c4c4;
1852  }
1853  
1854  .DayPickerNavigation_button__default:active {
1855    background: #f2f2f2;
1856  }
1857  
1858  .DayPickerNavigation_button__horizontalDefault {
1859    position: absolute;
1860    top: 18px;
1861    line-height: 0.78;
1862    border-radius: 3px;
1863    padding: 6px 9px;
1864  }
1865  
1866  .DayPickerNavigation_leftButton__horizontalDefault {
1867    left: 22px;
1868  }
1869  
1870  .DayPickerNavigation_rightButton__horizontalDefault {
1871    right: 22px;
1872  }
1873  
1874  .DayPickerNavigation_button__verticalDefault {
1875    padding: 5px;
1876    background: #fff;
1877    box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1);
1878    position: relative;
1879    display: inline-block;
1880    height: 100%;
1881    width: 50%;
1882  }
1883  
1884  .DayPickerNavigation_nextButton__verticalDefault {
1885    border-left: 0;
1886  }
1887  
1888  .DayPickerNavigation_nextButton__verticalScrollableDefault {
1889    width: 100%;
1890  }
1891  
1892  .DayPickerNavigation_svg__horizontal {
1893    height: 19px;
1894    width: 19px;
1895    fill: #82888a;
1896    display: block;
1897  }
1898  
1899  .DayPickerNavigation_svg__vertical {
1900    height: 42px;
1901    width: 42px;
1902    fill: #484848;
1903    display: block;
1904  }
1905  
1906  .DayPicker {
1907    background: #fff;
1908    position: relative;
1909    text-align: left;
1910  }
1911  
1912  .DayPicker__horizontal {
1913    background: #fff;
1914  }
1915  
1916  .DayPicker__verticalScrollable {
1917    height: 100%;
1918  }
1919  
1920  .DayPicker__hidden {
1921    visibility: hidden;
1922  }
1923  
1924  .DayPicker__withBorder {
1925    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.07);
1926    border-radius: 3px;
1927  }
1928  
1929  .DayPicker_portal__horizontal {
1930    box-shadow: none;
1931    position: absolute;
1932    left: 50%;
1933    top: 50%;
1934  }
1935  
1936  .DayPicker_portal__vertical {
1937    position: initial;
1938  }
1939  
1940  .DayPicker_focusRegion {
1941    outline: 0;
1942  }
1943  
1944  .DayPicker_calendarInfo__horizontal,
1945  .DayPicker_wrapper__horizontal {
1946    display: inline-block;
1947    vertical-align: top;
1948  }
1949  
1950  .DayPicker_weekHeaders {
1951    position: relative;
1952  }
1953  
1954  .DayPicker_weekHeaders__horizontal {
1955    margin-left: 13px;
1956  }
1957  
1958  .DayPicker_weekHeader {
1959    color: #757575;
1960    position: absolute;
1961    top: 62px;
1962    z-index: 2;
1963    text-align: left;
1964    padding: 0 !important;
1965  }
1966  
1967  .DayPicker_weekHeader__vertical {
1968    left: 50%;
1969  }
1970  
1971  .DayPicker_weekHeader__verticalScrollable {
1972    top: 0;
1973    display: table-row;
1974    border-bottom: 1px solid #dbdbdb;
1975    background: #fff;
1976    margin-left: 0;
1977    left: 0;
1978    width: 100%;
1979    text-align: center;
1980  }
1981  
1982  .DayPicker_weekHeader_ul {
1983    list-style: none;
1984    margin: 1px 0;
1985    padding-left: 0;
1986    padding-right: 0;
1987    font-size: 14px;
1988  }
1989  
1990  .DayPicker_weekHeader_li {
1991    display: inline-block;
1992    text-align: center;
1993    margin: 0 1px;
1994  }
1995  
1996  .DayPicker_transitionContainer {
1997    position: relative;
1998    overflow: hidden;
1999    border-radius: 3px;
2000  }
2001  
2002  .DayPicker_transitionContainer__horizontal {
2003    transition: height 0.2s ease-in-out;
2004  }
2005  
2006  .DayPicker_transitionContainer__vertical {
2007    width: 100%;
2008  }
2009  
2010  .DayPicker_transitionContainer__verticalScrollable {
2011    padding-top: 20px;
2012    height: 100%;
2013    position: absolute;
2014    top: 0;
2015    bottom: 0;
2016    right: 0;
2017    left: 0;
2018    overflow-y: scroll;
2019  }
2020  
2021  .DateInput {
2022    margin: 0;
2023    padding: 0;
2024    background: #fff;
2025    position: relative;
2026    display: inline-block;
2027    width: 130px;
2028    vertical-align: middle;
2029  }
2030  
2031  .DateInput__small {
2032    width: 97px;
2033  }
2034  
2035  .DateInput__block {
2036    width: 100%;
2037  }
2038  
2039  .DateInput__disabled {
2040    background: #f2f2f2;
2041    color: #dbdbdb;
2042  }
2043  
2044  .DateInput_input {
2045    font-weight: 200;
2046    font-size: 19px;
2047    line-height: 24px;
2048    color: #484848;
2049    background-color: #fff;
2050    width: 100%;
2051    padding: 11px 11px 9px;
2052    border: 0;
2053    border-top: 0;
2054    border-right: 0;
2055    border-bottom: 2px solid transparent;
2056    border-left: 0;
2057    border-radius: 0;
2058  }
2059  
2060  .DateInput_input__small {
2061    font-size: 15px;
2062    line-height: 18px;
2063    letter-spacing: 0.2px;
2064    padding: 7px 7px 5px;
2065  }
2066  
2067  .DateInput_input__regular {
2068    font-weight: auto;
2069  }
2070  
2071  .DateInput_input__readOnly {
2072    -webkit-user-select: none;
2073    user-select: none;
2074  }
2075  
2076  .DateInput_input__focused {
2077    outline: 0;
2078    background: #fff;
2079    border: 0;
2080    border-top: 0;
2081    border-right: 0;
2082    border-bottom: 2px solid #008489;
2083    border-left: 0;
2084  }
2085  
2086  .DateInput_input__disabled {
2087    background: #f2f2f2;
2088    font-style: italic;
2089  }
2090  
2091  .DateInput_screenReaderMessage {
2092    border: 0;
2093    clip: rect(0, 0, 0, 0);
2094    height: 1px;
2095    margin: -1px;
2096    overflow: hidden;
2097    padding: 0;
2098    position: absolute;
2099    width: 1px;
2100  }
2101  
2102  .DateInput_fang {
2103    position: absolute;
2104    width: 20px;
2105    height: 10px;
2106    left: 22px;
2107    z-index: 2;
2108  }
2109  
2110  .DateInput_fangShape {
2111    fill: #fff;
2112  }
2113  
2114  .DateInput_fangStroke {
2115    stroke: #dbdbdb;
2116    fill: transparent;
2117  }
2118  
2119  .DateRangePickerInput {
2120    background-color: #fff;
2121    display: inline-block;
2122  }
2123  
2124  .DateRangePickerInput__disabled {
2125    background: #f2f2f2;
2126  }
2127  
2128  .DateRangePickerInput__withBorder {
2129    border-radius: 2px;
2130    border: 1px solid #dbdbdb;
2131  }
2132  
2133  .DateRangePickerInput__rtl {
2134    direction: rtl;
2135  }
2136  
2137  .DateRangePickerInput__block {
2138    display: block;
2139  }
2140  
2141  .DateRangePickerInput__showClearDates {
2142    padding-right: 30px;
2143  }
2144  
2145  .DateRangePickerInput_arrow {
2146    display: inline-block;
2147    vertical-align: middle;
2148    color: #484848;
2149  }
2150  
2151  .DateRangePickerInput_arrow_svg {
2152    vertical-align: middle;
2153    fill: #484848;
2154    height: 24px;
2155    width: 24px;
2156  }
2157  
2158  .DateRangePickerInput_clearDates {
2159    background: 0 0;
2160    border: 0;
2161    color: inherit;
2162    font: inherit;
2163    line-height: normal;
2164    overflow: visible;
2165    cursor: pointer;
2166    padding: 10px;
2167    margin: 0 10px 0 5px;
2168    position: absolute;
2169    right: 0;
2170    top: 50%;
2171    transform: translateY(-50%);
2172  }
2173  
2174  .DateRangePickerInput_clearDates__small {
2175    padding: 6px;
2176  }
2177  
2178  .DateRangePickerInput_clearDates_default:focus,
2179  .DateRangePickerInput_clearDates_default:hover {
2180    background: #dbdbdb;
2181    border-radius: 50%;
2182  }
2183  
2184  .DateRangePickerInput_clearDates__hide {
2185    visibility: hidden;
2186  }
2187  
2188  .DateRangePickerInput_clearDates_svg {
2189    fill: #82888a;
2190    height: 12px;
2191    width: 15px;
2192    vertical-align: middle;
2193  }
2194  
2195  .DateRangePickerInput_clearDates_svg__small {
2196    height: 9px;
2197  }
2198  
2199  .DateRangePickerInput_calendarIcon {
2200    background: 0 0;
2201    border: 0;
2202    color: inherit;
2203    font: inherit;
2204    line-height: normal;
2205    overflow: visible;
2206    cursor: pointer;
2207    display: inline-block;
2208    vertical-align: middle;
2209    padding: 10px;
2210    margin: 0 5px 0 10px;
2211  }
2212  
2213  .DateRangePickerInput_calendarIcon_svg {
2214    fill: #82888a;
2215    height: 15px;
2216    width: 14px;
2217    vertical-align: middle;
2218  }
2219  
2220  .DateRangePicker {
2221    position: relative;
2222    display: inline-block;
2223  }
2224  
2225  .DateRangePicker__block {
2226    display: block;
2227  }
2228  
2229  .DateRangePicker_picker {
2230    z-index: 1;
2231    background-color: #fff;
2232    position: absolute;
2233  }
2234  
2235  .DateRangePicker_picker__rtl {
2236    direction: rtl;
2237  }
2238  
2239  .DateRangePicker_picker__directionLeft {
2240    left: 0;
2241  }
2242  
2243  .DateRangePicker_picker__directionRight {
2244    right: 0;
2245  }
2246  
2247  .DateRangePicker_picker__portal {
2248    background-color: rgba(0, 0, 0, 0.3);
2249    position: fixed;
2250    top: 0;
2251    left: 0;
2252    height: 100%;
2253    width: 100%;
2254  }
2255  
2256  .DateRangePicker_picker__fullScreenPortal {
2257    background-color: #fff;
2258  }
2259  
2260  .DateRangePicker_closeButton {
2261    background: 0 0;
2262    border: 0;
2263    color: inherit;
2264    font: inherit;
2265    line-height: normal;
2266    overflow: visible;
2267    cursor: pointer;
2268    position: absolute;
2269    top: 0;
2270    right: 0;
2271    padding: 15px;
2272    z-index: 2;
2273  }
2274  
2275  .DateRangePicker_closeButton:focus,
2276  .DateRangePicker_closeButton:hover {
2277    color: #b0b3b4;
2278    text-decoration: none;
2279  }
2280  
2281  .DateRangePicker_closeButton_svg {
2282    height: 15px;
2283    width: 15px;
2284    fill: #cacccd;
2285  }
2286  
2287  /*rtl:end:ignore*/
2288  .components-datetime {
2289    padding: 16px;
2290  }
2291  .components-panel__body .components-datetime {
2292    padding: 0;
2293  }
2294  .components-datetime .components-datetime__calendar-help {
2295    padding: 16px;
2296  }
2297  .components-datetime .components-datetime__calendar-help h4 {
2298    margin: 0;
2299  }
2300  .components-datetime .components-datetime__buttons {
2301    display: flex;
2302    justify-content: space-between;
2303  }
2304  .components-datetime .components-datetime__date-help-toggle {
2305    display: block;
2306    margin-left: auto;
2307  }
2308  .components-datetime fieldset {
2309    border: 0;
2310    padding: 0;
2311    margin: 0;
2312  }
2313  .components-datetime select,
2314  .components-datetime input {
2315    box-shadow: 0 0 0 transparent;
2316    transition: box-shadow 0.1s linear;
2317    border-radius: 2px;
2318    border: 1px solid #757575;
2319  }
2320  @media (prefers-reduced-motion: reduce) {
2321    .components-datetime select,
2322  .components-datetime input {
2323      transition-duration: 0s;
2324      transition-delay: 0s;
2325    }
2326  }
2327  .components-datetime select,
2328  .components-datetime input[type=number],
2329  .components-datetime .components-button {
2330    height: 30px;
2331    margin-top: 0;
2332    margin-bottom: 0;
2333  }
2334  
2335  .components-datetime__date {
2336    min-height: 236px;
2337    border-top: 1px solid #ddd;
2338  }
2339  .components-datetime__date .DayPickerNavigation_leftButton__horizontalDefault {
2340    /*!rtl:begin:ignore*/
2341    left: 13px;
2342    /*!rtl:end:ignore*/
2343  }
2344  .components-datetime__date .CalendarMonth_caption {
2345    font-size: 13px;
2346  }
2347  .components-datetime__date .CalendarMonth_table {
2348    border-collapse: separate;
2349    border-spacing: 2px;
2350  }
2351  .components-datetime__date .CalendarDay {
2352    font-size: 13px;
2353    border: none;
2354    border-radius: 50%;
2355    text-align: center;
2356  }
2357  .components-datetime__date .CalendarDay:focus {
2358    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 3px #fff;
2359    outline: 2px solid transparent;
2360  }
2361  .components-datetime__date .CalendarDay__selected {
2362    background: var(--wp-admin-theme-color);
2363    border: 2px solid transparent;
2364  }
2365  .components-datetime__date .CalendarDay__selected:hover {
2366    background: var(--wp-admin-theme-color-darker-20);
2367  }
2368  .components-datetime__date .CalendarDay__selected:focus {
2369    box-shadow: inset 0 0 0 1px #fff;
2370  }
2371  .components-datetime__date .DayPickerNavigation_button__horizontalDefault {
2372    padding: 2px 8px;
2373    top: 20px;
2374  }
2375  .components-datetime__date .DayPickerNavigation_button__horizontalDefault:focus {
2376    border-color: var(--wp-admin-theme-color);
2377    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
2378    outline: 2px solid transparent;
2379  }
2380  .components-datetime__date .DayPicker_weekHeader {
2381    top: 50px;
2382  }
2383  .components-datetime__date .DayPicker_weekHeader .DayPicker_weekHeader_ul {
2384    margin: 1px;
2385    padding-left: 0;
2386    padding-right: 0;
2387  }
2388  .components-datetime__date.is-description-visible .DayPicker {
2389    visibility: hidden;
2390  }
2391  
2392  .components-datetime__date .CalendarDay .components-datetime__date__day {
2393    height: 100%;
2394    display: flex;
2395    justify-content: center;
2396    align-content: center;
2397    flex-direction: column;
2398    position: relative;
2399  }
2400  .components-datetime__date .CalendarDay .components-datetime__date__day.has-events::before {
2401    content: " ";
2402    width: 4px;
2403    height: 4px;
2404    border-radius: 2px;
2405    position: absolute;
2406    left: 50%;
2407    margin-left: -2px;
2408    bottom: 0;
2409    background-color: #fff;
2410  }
2411  
2412  .components-datetime__date .CalendarDay:not(.CalendarDay__selected) .components-datetime__date__day.has-events::before {
2413    background: var(--wp-admin-theme-color);
2414  }
2415  
2416  .components-datetime__time {
2417    padding-bottom: 16px;
2418  }
2419  .components-datetime__time fieldset {
2420    position: relative;
2421    margin-bottom: 0.5em;
2422  }
2423  .components-datetime__time fieldset + fieldset {
2424    margin-bottom: 0;
2425  }
2426  .components-datetime__time .components-datetime__time-field-am-pm fieldset {
2427    margin-top: 0;
2428  }
2429  .components-datetime__time .components-datetime__time-wrapper {
2430    display: flex;
2431  }
2432  .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-separator {
2433    display: inline-block;
2434    padding: 0 3px 0 0;
2435  }
2436  .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field-time {
2437    /*rtl:ignore*/
2438    direction: ltr;
2439  }
2440  .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select {
2441    margin-right: 4px;
2442  }
2443  .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select:focus {
2444    position: relative;
2445    z-index: 1;
2446  }
2447  .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type=number] {
2448    padding: 2px;
2449    margin-right: 4px;
2450    text-align: center;
2451    -moz-appearance: textfield;
2452  }
2453  .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type=number]:focus {
2454    position: relative;
2455    z-index: 1;
2456  }
2457  .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type=number]::-webkit-inner-spin-button {
2458    -webkit-appearance: none;
2459    margin: 0;
2460  }
2461  .components-datetime__time.is-12-hour .components-datetime__time-field-day input {
2462    margin: -4px 0 0 !important;
2463    border-radius: 2px 0 0 2px !important;
2464  }
2465  .components-datetime__time.is-12-hour .components-datetime__time-field-year input {
2466    border-radius: 0 2px 2px 0 !important;
2467  }
2468  
2469  .components-datetime__timezone {
2470    line-height: 30px;
2471    margin-left: 4px;
2472    -webkit-text-decoration: underline dotted;
2473            text-decoration: underline dotted;
2474  }
2475  
2476  .components-datetime__time-legend {
2477    font-weight: 600;
2478    margin-top: 0.5em;
2479  }
2480  .components-datetime__time-legend.invisible {
2481    position: absolute;
2482    top: -999em;
2483    left: -999em;
2484  }
2485  
2486  .components-datetime__time-field-hours-input,
2487  .components-datetime__time-field-minutes-input,
2488  .components-datetime__time-field-day-input {
2489    width: 35px;
2490  }
2491  
2492  .components-datetime__time-field-year-input {
2493    width: 55px;
2494  }
2495  
2496  .components-datetime__time-field-month-select {
2497    max-width: 145px;
2498  }
2499  
2500  .components-popover .components-datetime__date {
2501    padding-left: 4px;
2502  }
2503  
2504  .block-editor-dimension-control .components-base-control__field {
2505    display: flex;
2506    align-items: center;
2507  }
2508  .block-editor-dimension-control .components-base-control__label {
2509    display: flex;
2510    align-items: center;
2511    margin-right: 1em;
2512    margin-bottom: 0;
2513  }
2514  .block-editor-dimension-control .components-base-control__label .dashicon {
2515    margin-right: 0.5em;
2516  }
2517  .block-editor-dimension-control.is-manual .components-base-control__label {
2518    width: 10em;
2519  }
2520  
2521  body.is-dragging-components-draggable {
2522    cursor: move;
2523    /* Fallback for IE/Edge < 14 */
2524    cursor: grabbing !important;
2525  }
2526  
2527  .components-draggable__invisible-drag-image {
2528    position: fixed;
2529    left: -1000px;
2530    height: 50px;
2531    width: 50px;
2532  }
2533  
2534  .components-draggable__clone {
2535    position: fixed;
2536    padding: 0;
2537    background: transparent;
2538    pointer-events: none;
2539    z-index: 1000000000;
2540  }
2541  
2542  .components-drop-zone {
2543    position: absolute;
2544    top: 0;
2545    right: 0;
2546    bottom: 0;
2547    left: 0;
2548    z-index: 40;
2549    visibility: hidden;
2550    opacity: 0;
2551    transition: 0.3s opacity, 0.3s background-color, 0s visibility 0.3s;
2552    border: 2px solid var(--wp-admin-theme-color);
2553    border-radius: 2px;
2554  }
2555  @media (prefers-reduced-motion: reduce) {
2556    .components-drop-zone {
2557      transition-duration: 0s;
2558      transition-delay: 0s;
2559    }
2560  }
2561  .components-drop-zone.is-active {
2562    opacity: 1;
2563    visibility: visible;
2564    transition: 0.3s opacity, 0.3s background-color;
2565  }
2566  @media (prefers-reduced-motion: reduce) {
2567    .components-drop-zone.is-active {
2568      transition-duration: 0s;
2569      transition-delay: 0s;
2570    }
2571  }
2572  .components-drop-zone.is-dragging-over-element {
2573    background-color: var(--wp-admin-theme-color);
2574  }
2575  
2576  .components-drop-zone__content {
2577    position: absolute;
2578    top: 50%;
2579    left: 0;
2580    right: 0;
2581    z-index: 50;
2582    transform: translateY(-50%);
2583    width: 100%;
2584    text-align: center;
2585    color: #fff;
2586    transition: transform 0.2s ease-in-out;
2587  }
2588  @media (prefers-reduced-motion: reduce) {
2589    .components-drop-zone__content {
2590      transition-duration: 0s;
2591      transition-delay: 0s;
2592    }
2593  }
2594  
2595  .components-drop-zone.is-dragging-over-element .components-drop-zone__content {
2596    transform: translateY(-50%) scale(1.05);
2597  }
2598  
2599  .components-drop-zone__content-icon,
2600  .components-drop-zone__content-text {
2601    display: block;
2602  }
2603  
2604  .components-drop-zone__content-icon {
2605    margin: 0 auto;
2606    line-height: 0;
2607    fill: currentColor;
2608  }
2609  
2610  .components-drop-zone__content-text {
2611    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2612  }
2613  
2614  .components-dropdown {
2615    display: inline-block;
2616  }
2617  
2618  .components-dropdown__content .components-popover__content > div {
2619    padding: 12px;
2620  }
2621  
2622  .components-dropdown-menu__popover .components-popover__content {
2623    min-width: 200px;
2624  }
2625  
2626  .components-dropdown-menu__menu {
2627    width: 100%;
2628    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2629    font-size: 13px;
2630    line-height: 1.4;
2631  }
2632  .components-dropdown-menu__menu .components-dropdown-menu__menu-item,
2633  .components-dropdown-menu__menu .components-menu-item {
2634    width: 100%;
2635    padding: 6px;
2636    outline: none;
2637    cursor: pointer;
2638    white-space: nowrap;
2639  }
2640  .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator,
2641  .components-dropdown-menu__menu .components-menu-item.has-separator {
2642    margin-top: 6px;
2643    position: relative;
2644    overflow: visible;
2645  }
2646  .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator::before,
2647  .components-dropdown-menu__menu .components-menu-item.has-separator::before {
2648    display: block;
2649    content: "";
2650    box-sizing: content-box;
2651    background-color: #ddd;
2652    position: absolute;
2653    top: -3px;
2654    left: 0;
2655    right: 0;
2656    height: 1px;
2657  }
2658  .components-dropdown-menu__menu .components-dropdown-menu__menu-item.is-active svg,
2659  .components-dropdown-menu__menu .components-menu-item.is-active svg {
2660    color: #fff;
2661    background: #1e1e1e;
2662    box-shadow: 0 0 0 1px #1e1e1e;
2663    border-radius: 1px;
2664  }
2665  .components-dropdown-menu__menu .components-dropdown-menu__menu-item > svg,
2666  .components-dropdown-menu__menu .components-menu-item > svg {
2667    border-radius: 2px;
2668    width: 24px;
2669    height: 24px;
2670  }
2671  .components-dropdown-menu__menu .components-menu-item__button,
2672  .components-dropdown-menu__menu .components-menu-item__button.components-button {
2673    min-height: 36px;
2674    height: auto;
2675    text-align: left;
2676    padding-left: 8px;
2677    padding-right: 8px;
2678  }
2679  .components-dropdown-menu__menu .components-menu-group {
2680    padding: 12px;
2681    margin-top: 0;
2682    margin-bottom: 0;
2683    margin-left: -12px;
2684    margin-right: -12px;
2685  }
2686  .components-dropdown-menu__menu .components-menu-group:first-child {
2687    margin-top: -12px;
2688  }
2689  .components-dropdown-menu__menu .components-menu-group:last-child {
2690    margin-bottom: -12px;
2691  }
2692  .components-dropdown-menu__menu .components-menu-group + .components-menu-group {
2693    margin-top: 0;
2694    border-top: 1px solid #ccc;
2695    padding: 12px;
2696  }
2697  .is-alternate .components-dropdown-menu__menu .components-menu-group + .components-menu-group {
2698    border-color: #1e1e1e;
2699  }
2700  
2701  .components-font-size-picker__controls {
2702    max-width: 248px;
2703    display: flex;
2704    flex-wrap: wrap;
2705    align-items: center;
2706    margin-bottom: 24px;
2707  }
2708  .components-font-size-picker__controls .components-unit-control-wrapper {
2709    margin-right: 8px;
2710  }
2711  .components-font-size-picker__controls .components-unit-control-wrapper .components-input-control__label {
2712    font-weight: 300;
2713    padding-bottom: 0 !important;
2714    margin-bottom: 8px !important;
2715  }
2716  .components-font-size-picker__controls .components-custom-select-control__button {
2717    min-width: 120px;
2718  }
2719  .components-font-size-picker__controls .components-font-size-picker__number {
2720    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2721    padding: 6px 8px;
2722    box-shadow: 0 0 0 transparent;
2723    transition: box-shadow 0.1s linear;
2724    border-radius: 2px;
2725    border: 1px solid #757575;
2726    /* Fonts smaller than 16px causes mobile safari to zoom. */
2727    font-size: 16px;
2728    /* Override core line-height. To be reviewed. */
2729    line-height: normal;
2730    display: inline-block;
2731    font-weight: 500;
2732    height: 30px;
2733    margin-bottom: 0;
2734    margin-left: 0;
2735    margin-right: 8px;
2736    margin-top: 8px;
2737    width: 54px;
2738  }
2739  @media (prefers-reduced-motion: reduce) {
2740    .components-font-size-picker__controls .components-font-size-picker__number {
2741      transition-duration: 0s;
2742      transition-delay: 0s;
2743    }
2744  }
2745  @media (min-width: 600px) {
2746    .components-font-size-picker__controls .components-font-size-picker__number {
2747      font-size: 13px;
2748      /* Override core line-height. To be reviewed. */
2749      line-height: normal;
2750    }
2751  }
2752  .components-font-size-picker__controls .components-font-size-picker__number:focus {
2753    border-color: var(--wp-admin-theme-color);
2754    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
2755    outline: 2px solid transparent;
2756  }
2757  .components-font-size-picker__controls .components-font-size-picker__number::-webkit-input-placeholder {
2758    color: rgba(30, 30, 30, 0.62);
2759  }
2760  .components-font-size-picker__controls .components-font-size-picker__number::-moz-placeholder {
2761    opacity: 1;
2762    color: rgba(30, 30, 30, 0.62);
2763  }
2764  .components-font-size-picker__controls .components-font-size-picker__number:-ms-input-placeholder {
2765    color: rgba(30, 30, 30, 0.62);
2766  }
2767  .components-font-size-picker__controls .components-font-size-picker__number[value=""] + .components-button {
2768    cursor: default;
2769    opacity: 0.3;
2770    pointer-events: none;
2771  }
2772  .components-font-size-picker__controls .components-font-size-picker__number-container {
2773    display: flex;
2774    flex-direction: column;
2775  }
2776  .components-font-size-picker__controls .components-font-size-picker__select {
2777    margin-right: 8px;
2778  }
2779  .components-font-size-picker__controls .components-color-palette__clear {
2780    height: 30px;
2781    margin-top: 26px;
2782  }
2783  
2784  .components-font-size-picker__custom-input .components-range-control__slider + .dashicon {
2785    width: 30px;
2786    height: 30px;
2787  }
2788  
2789  .components-font-size-picker {
2790    border: 0;
2791    padding: 0;
2792    margin: 0;
2793  }
2794  
2795  .components-form-toggle {
2796    position: relative;
2797    display: inline-block;
2798  }
2799  .components-form-toggle .components-form-toggle__track {
2800    content: "";
2801    display: inline-block;
2802    box-sizing: border-box;
2803    vertical-align: top;
2804    background-color: #fff;
2805    border: 1px solid #1e1e1e;
2806    width: 36px;
2807    height: 18px;
2808    border-radius: 9px;
2809    transition: 0.2s background ease;
2810  }
2811  @media (prefers-reduced-motion: reduce) {
2812    .components-form-toggle .components-form-toggle__track {
2813      transition-duration: 0s;
2814      transition-delay: 0s;
2815    }
2816  }
2817  .components-form-toggle .components-form-toggle__thumb {
2818    display: block;
2819    position: absolute;
2820    box-sizing: border-box;
2821    top: 3px;
2822    left: 3px;
2823    width: 12px;
2824    height: 12px;
2825    border-radius: 50%;
2826    transition: 0.1s transform ease;
2827    background-color: #1e1e1e;
2828    border: 5px solid #1e1e1e;
2829  }
2830  @media (prefers-reduced-motion: reduce) {
2831    .components-form-toggle .components-form-toggle__thumb {
2832      transition-duration: 0s;
2833      transition-delay: 0s;
2834    }
2835  }
2836  .components-form-toggle.is-checked .components-form-toggle__track {
2837    background-color: var(--wp-admin-theme-color);
2838    border: 1px solid var(--wp-admin-theme-color);
2839    border: 9px solid transparent;
2840  }
2841  .components-form-toggle .components-form-toggle__input:focus + .components-form-toggle__track {
2842    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
2843    outline: 2px solid transparent;
2844    outline-offset: 2px;
2845  }
2846  .components-form-toggle.is-checked .components-form-toggle__thumb {
2847    background-color: #fff;
2848    border-width: 0;
2849    transform: translateX(18px);
2850  }
2851  .components-form-toggle.is-disabled, .components-disabled .components-form-toggle {
2852    opacity: 0.3;
2853  }
2854  
2855  .components-form-toggle input.components-form-toggle__input[type=checkbox] {
2856    position: absolute;
2857    top: 0;
2858    left: 0;
2859    width: 100%;
2860    height: 100%;
2861    opacity: 0;
2862    margin: 0;
2863    padding: 0;
2864    z-index: 1;
2865    border: none;
2866  }
2867  .components-form-toggle input.components-form-toggle__input[type=checkbox]:checked {
2868    background: none;
2869  }
2870  .components-form-toggle input.components-form-toggle__input[type=checkbox]::before {
2871    content: "";
2872  }
2873  
2874  .components-form-token-field__input-container {
2875    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2876    padding: 6px 8px;
2877    box-shadow: 0 0 0 transparent;
2878    transition: box-shadow 0.1s linear;
2879    border-radius: 2px;
2880    border: 1px solid #757575;
2881    /* Fonts smaller than 16px causes mobile safari to zoom. */
2882    font-size: 16px;
2883    /* Override core line-height. To be reviewed. */
2884    line-height: normal;
2885    display: flex;
2886    flex-wrap: wrap;
2887    align-items: center;
2888    width: 100%;
2889    margin: 0 0 8px 0;
2890    padding: 2px 4px;
2891    cursor: text;
2892  }
2893  @media (prefers-reduced-motion: reduce) {
2894    .components-form-token-field__input-container {
2895      transition-duration: 0s;
2896      transition-delay: 0s;
2897    }
2898  }
2899  @media (min-width: 600px) {
2900    .components-form-token-field__input-container {
2901      font-size: 13px;
2902      /* Override core line-height. To be reviewed. */
2903      line-height: normal;
2904    }
2905  }
2906  .components-form-token-field__input-container:focus {
2907    border-color: var(--wp-admin-theme-color);
2908    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
2909    outline: 2px solid transparent;
2910  }
2911  .components-form-token-field__input-container::-webkit-input-placeholder {
2912    color: rgba(30, 30, 30, 0.62);
2913  }
2914  .components-form-token-field__input-container::-moz-placeholder {
2915    opacity: 1;
2916    color: rgba(30, 30, 30, 0.62);
2917  }
2918  .components-form-token-field__input-container:-ms-input-placeholder {
2919    color: rgba(30, 30, 30, 0.62);
2920  }
2921  .components-form-token-field__input-container.is-disabled {
2922    background: #ddd;
2923    border-color: #ddd;
2924  }
2925  .components-form-token-field__input-container.is-active {
2926    border-color: var(--wp-admin-theme-color);
2927    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
2928    outline: 2px solid transparent;
2929  }
2930  .components-form-token-field__input-container input[type=text].components-form-token-field__input {
2931    display: inline-block;
2932    flex: 1;
2933    font-size: 16px;
2934    width: 100%;
2935    max-width: 100%;
2936    margin-left: 4px;
2937    padding: 0;
2938    min-height: 24px;
2939    min-width: 50px;
2940    background: inherit;
2941    border: 0;
2942    color: #1e1e1e;
2943    box-shadow: none;
2944  }
2945  @media (min-width: 600px) {
2946    .components-form-token-field__input-container input[type=text].components-form-token-field__input {
2947      font-size: 13px;
2948    }
2949  }
2950  .components-form-token-field__input-container input[type=text].components-form-token-field__input:focus, .components-form-token-field.is-active .components-form-token-field__input-container input[type=text].components-form-token-field__input {
2951    outline: none;
2952    box-shadow: none;
2953  }
2954  .components-form-token-field__input-container .components-form-token-field__token + input[type=text].components-form-token-field__input {
2955    width: auto;
2956  }
2957  
2958  .components-form-token-field__label {
2959    display: inline-block;
2960    margin-bottom: 4px;
2961  }
2962  
2963  .components-form-token-field__help {
2964    font-size: 12px;
2965    font-style: normal;
2966    color: #757575;
2967  }
2968  
2969  .components-form-token-field__token {
2970    font-size: 13px;
2971    display: flex;
2972    margin: 2px 4px 2px 0;
2973    color: #1e1e1e;
2974    max-width: 100%;
2975  }
2976  .components-form-token-field__token.is-success .components-form-token-field__token-text,
2977  .components-form-token-field__token.is-success .components-form-token-field__remove-token {
2978    background: #4ab866;
2979  }
2980  .components-form-token-field__token.is-error .components-form-token-field__token-text,
2981  .components-form-token-field__token.is-error .components-form-token-field__remove-token {
2982    background: #cc1818;
2983  }
2984  .components-form-token-field__token.is-validating .components-form-token-field__token-text,
2985  .components-form-token-field__token.is-validating .components-form-token-field__remove-token {
2986    color: #757575;
2987  }
2988  .components-form-token-field__token.is-borderless {
2989    position: relative;
2990    padding: 0 16px 0 0;
2991  }
2992  .components-form-token-field__token.is-borderless .components-form-token-field__token-text {
2993    background: transparent;
2994    color: var(--wp-admin-theme-color);
2995  }
2996  .components-form-token-field__token.is-borderless .components-form-token-field__remove-token {
2997    background: transparent;
2998    color: #757575;
2999    position: absolute;
3000    top: 1px;
3001    right: 0;
3002  }
3003  .components-form-token-field__token.is-borderless.is-success .components-form-token-field__token-text {
3004    color: #4ab866;
3005  }
3006  .components-form-token-field__token.is-borderless.is-error .components-form-token-field__token-text {
3007    color: #cc1818;
3008    border-radius: 4px 0 0 4px;
3009    padding: 0 4px 0 6px;
3010  }
3011  .components-form-token-field__token.is-borderless.is-validating .components-form-token-field__token-text {
3012    color: #1e1e1e;
3013  }
3014  .components-form-token-field__token.is-disabled .components-form-token-field__remove-token {
3015    cursor: default;
3016  }
3017  
3018  .components-form-token-field__token-text,
3019  .components-form-token-field__remove-token.components-button {
3020    display: inline-block;
3021    line-height: 24px;
3022    height: auto;
3023    background: #ddd;
3024    min-width: unset;
3025    transition: all 0.2s cubic-bezier(0.4, 1, 0.4, 1);
3026  }
3027  @media (prefers-reduced-motion: reduce) {
3028    .components-form-token-field__token-text,
3029  .components-form-token-field__remove-token.components-button {
3030      transition-duration: 0s;
3031      transition-delay: 0s;
3032      animation-duration: 1ms;
3033      animation-delay: 0s;
3034    }
3035  }
3036  
3037  .components-form-token-field__token-text {
3038    border-radius: 2px 0 0 2px;
3039    padding: 0 0 0 8px;
3040    white-space: nowrap;
3041    overflow: hidden;
3042    text-overflow: ellipsis;
3043  }
3044  
3045  .components-form-token-field__remove-token.components-button {
3046    cursor: pointer;
3047    border-radius: 0 2px 2px 0;
3048    padding: 0 2px;
3049    color: #1e1e1e;
3050    line-height: 10px;
3051    overflow: initial;
3052  }
3053  .components-form-token-field__remove-token.components-button:hover {
3054    color: #1e1e1e;
3055  }
3056  
3057  .components-form-token-field__suggestions-list {
3058    flex: 1 0 100%;
3059    min-width: 100%;
3060    max-height: 9em;
3061    overflow-y: auto;
3062    transition: all 0.15s ease-in-out;
3063    list-style: none;
3064    border-top: 1px solid #757575;
3065    margin: 4px -4px -4px;
3066    padding: 0;
3067  }
3068  @media (prefers-reduced-motion: reduce) {
3069    .components-form-token-field__suggestions-list {
3070      transition-duration: 0s;
3071      transition-delay: 0s;
3072    }
3073  }
3074  
3075  .components-form-token-field__suggestion {
3076    color: #757575;
3077    display: block;
3078    font-size: 13px;
3079    padding: 4px 8px;
3080    margin: 0;
3081    cursor: pointer;
3082  }
3083  .components-form-token-field__suggestion.is-selected {
3084    background: var(--wp-admin-theme-color);
3085    color: #fff;
3086  }
3087  
3088  .components-form-token-field__suggestion-match {
3089    text-decoration: underline;
3090  }
3091  
3092  @media (min-width: 600px) {
3093    .components-guide {
3094      width: 600px;
3095    }
3096  }
3097  .components-guide .components-modal__header {
3098    background: none;
3099    border-bottom: none;
3100    width: 100%;
3101    padding: 0;
3102    margin: 0;
3103  }
3104  .components-guide .components-modal__header .components-button {
3105    align-self: flex-start;
3106    margin: 8px 8px 0 0;
3107    position: static;
3108  }
3109  .components-guide .components-modal__header .components-button:hover svg {
3110    fill: #fff;
3111  }
3112  .components-guide__container {
3113    display: flex;
3114    flex-direction: column;
3115    justify-content: space-between;
3116    margin-top: -60px;
3117    min-height: 100%;
3118  }
3119  .components-guide__page {
3120    display: flex;
3121    flex-direction: column;
3122    justify-content: center;
3123    position: relative;
3124  }
3125  @media (min-width: 600px) {
3126    .components-guide__page {
3127      min-height: 300px;
3128    }
3129  }
3130  .components-guide__footer {
3131    align-content: center;
3132    display: flex;
3133    height: 30px;
3134    justify-content: center;
3135    margin: 0 0 24px 0;
3136    padding: 0 32px;
3137    position: relative;
3138    width: 100%;
3139  }
3140  @media (max-width: 600px) {
3141    .components-guide__footer {
3142      position: absolute;
3143      bottom: 0;
3144    }
3145  }
3146  .components-guide__page-control {
3147    margin: 0;
3148    text-align: center;
3149  }
3150  .components-guide__page-control li {
3151    display: inline-block;
3152    margin: 0;
3153  }
3154  .components-guide__page-control .components-button {
3155    height: 30px;
3156    min-width: 20px;
3157    margin: -6px 0;
3158  }
3159  .components-guide .components-modal__content {
3160    padding: 0;
3161  }
3162  
3163  .components-modal__frame.components-guide {
3164    border: none;
3165    min-width: 312px;
3166    height: 80vh;
3167    max-height: 575px;
3168  }
3169  @media (max-width: 600px) {
3170    .components-modal__frame.components-guide {
3171      bottom: 5%;
3172      left: 16px;
3173      right: 16px;
3174      top: 5%;
3175      margin: 0 auto;
3176    }
3177  }
3178  
3179  .components-button.components-guide__back-button, .components-button.components-guide__forward-button, .components-button.components-guide__finish-button {
3180    height: 30px;
3181    position: absolute;
3182  }
3183  .components-button.components-guide__back-button, .components-button.components-guide__forward-button {
3184    font-size: 13px;
3185    padding: 4px 2px;
3186  }
3187  .components-button.components-guide__back-button.has-text svg, .components-button.components-guide__forward-button.has-text svg {
3188    margin: 0;
3189  }
3190  .components-button.components-guide__back-button:hover, .components-button.components-guide__forward-button:hover {
3191    text-decoration: underline;
3192  }
3193  .components-button.components-guide__back-button {
3194    left: 32px;
3195  }
3196  .components-button.components-guide__forward-button {
3197    right: 32px;
3198    color: #1386bf;
3199    font-weight: bold;
3200  }
3201  .components-button.components-guide__finish-button {
3202    right: 32px;
3203  }
3204  .components-button.components-guide__inline-finish-button {
3205    display: none;
3206  }
3207  
3208  [role=region] {
3209    position: relative;
3210  }
3211  
3212  .is-focusing-regions [role=region]:focus::after {
3213    content: "";
3214    position: absolute;
3215    top: 0;
3216    bottom: 0;
3217    left: 0;
3218    right: 0;
3219    pointer-events: none;
3220    outline: 4px solid transparent;
3221    box-shadow: inset 0 0 0 4px var(--wp-admin-theme-color);
3222  }
3223  @supports (outline-offset: 1px) {
3224    .is-focusing-regions [role=region]:focus::after {
3225      content: none;
3226    }
3227    .is-focusing-regions [role=region]:focus {
3228      outline-style: solid;
3229      outline-color: var(--wp-admin-theme-color);
3230      outline-width: 4px;
3231      outline-offset: -4px;
3232    }
3233  }
3234  
3235  .components-menu-group + .components-menu-group {
3236    margin-top: 8px;
3237    padding-top: 8px;
3238    border-top: 1px solid #1e1e1e;
3239  }
3240  .components-menu-group + .components-menu-group.has-hidden-separator {
3241    border-top: none;
3242    margin-top: 0;
3243    padding-top: 0;
3244  }
3245  
3246  .components-menu-group__label {
3247    padding: 0 8px;
3248    margin-top: 4px;
3249    margin-bottom: 12px;
3250    color: #757575;
3251    text-transform: uppercase;
3252    font-size: 11px;
3253    font-weight: 500;
3254  }
3255  
3256  .components-menu-item__button,
3257  .components-menu-item__button.components-button {
3258    width: 100%;
3259  }
3260  .components-menu-item__button .components-menu-items__item-icon,
3261  .components-menu-item__button.components-button .components-menu-items__item-icon {
3262    margin-right: -2px;
3263    margin-left: 24px;
3264    display: inline-block;
3265    flex: 0 0 auto;
3266  }
3267  .components-menu-item__button .components-menu-item__shortcut + .components-menu-items__item-icon,
3268  .components-menu-item__button.components-button .components-menu-item__shortcut + .components-menu-items__item-icon {
3269    margin-left: 8px;
3270  }
3271  .components-menu-item__button .block-editor-block-icon,
3272  .components-menu-item__button.components-button .block-editor-block-icon {
3273    margin-left: -2px;
3274    margin-right: 8px;
3275  }
3276  .components-menu-item__button.is-primary,
3277  .components-menu-item__button.components-button.is-primary {
3278    justify-content: center;
3279  }
3280  .components-menu-item__button.is-primary .components-menu-item__item,
3281  .components-menu-item__button.components-button.is-primary .components-menu-item__item {
3282    margin-right: 0;
3283  }
3284  
3285  .components-menu-item__info-wrapper {
3286    display: flex;
3287    flex-direction: column;
3288    margin-right: auto;
3289  }
3290  
3291  .components-menu-item__info {
3292    margin-top: 4px;
3293    font-size: 12px;
3294    color: #757575;
3295    white-space: normal;
3296  }
3297  
3298  .components-menu-item__item {
3299    white-space: nowrap;
3300    margin-right: auto;
3301    display: inline-flex;
3302    align-items: center;
3303  }
3304  
3305  .components-menu-item__shortcut {
3306    align-self: center;
3307    margin-right: 0;
3308    margin-left: auto;
3309    padding-left: 24px;
3310    color: currentColor;
3311    display: none;
3312  }
3313  @media (min-width: 480px) {
3314    .components-menu-item__shortcut {
3315      display: inline;
3316    }
3317  }
3318  
3319  .components-menu-items-choice svg,
3320  .components-menu-items-choice.components-button svg {
3321    margin-right: 12px;
3322  }
3323  .components-menu-items-choice.has-icon,
3324  .components-menu-items-choice.components-button.has-icon {
3325    padding-left: 12px;
3326  }
3327  
3328  .components-modal__screen-overlay {
3329    position: fixed;
3330    top: 0;
3331    right: 0;
3332    bottom: 0;
3333    left: 0;
3334    background-color: rgba(0, 0, 0, 0.35);
3335    z-index: 100000;
3336    animation: edit-post__fade-in-animation 0.2s ease-out 0s;
3337    animation-fill-mode: forwards;
3338  }
3339  @media (prefers-reduced-motion: reduce) {
3340    .components-modal__screen-overlay {
3341      animation-duration: 1ms;
3342      animation-delay: 0s;
3343    }
3344  }
3345  
3346  .components-modal__frame {
3347    position: absolute;
3348    top: 0;
3349    right: 0;
3350    bottom: 0;
3351    left: 0;
3352    box-sizing: border-box;
3353    margin: 0;
3354    background: #fff;
3355    box-shadow: 0 10px 10px rgba(0, 0, 0, 0.25);
3356    border-radius: 2px;
3357    overflow: auto;
3358  }
3359  @media (min-width: 600px) {
3360    .components-modal__frame {
3361      top: 50%;
3362      right: auto;
3363      bottom: auto;
3364      left: 50%;
3365      min-width: 360px;
3366      max-width: calc(100% - 16px - 16px);
3367      max-height: 90%;
3368      transform: translate(-50%, -50%);
3369      animation: components-modal__appear-animation 0.1s ease-out;
3370      animation-fill-mode: forwards;
3371    }
3372  }
3373  @media (min-width: 600px) and (prefers-reduced-motion: reduce) {
3374    .components-modal__frame {
3375      animation-duration: 1ms;
3376      animation-delay: 0s;
3377    }
3378  }
3379  
3380  @keyframes components-modal__appear-animation {
3381    from {
3382      margin-top: 32px;
3383    }
3384    to {
3385      margin-top: 0;
3386    }
3387  }
3388  .components-modal__header {
3389    box-sizing: border-box;
3390    border-bottom: 1px solid #ddd;
3391    padding: 0 32px;
3392    display: flex;
3393    flex-direction: row;
3394    justify-content: space-between;
3395    background: #fff;
3396    align-items: center;
3397    height: 60px;
3398    z-index: 10;
3399    position: relative;
3400    position: sticky;
3401    top: 0;
3402    margin: 0 -32px 24px;
3403  }
3404  @supports (-ms-ime-align: auto) {
3405    .components-modal__header {
3406      position: fixed;
3407      width: 100%;
3408    }
3409  }
3410  .components-modal__header .components-modal__header-heading {
3411    font-size: 1rem;
3412    font-weight: 600;
3413  }
3414  .components-modal__header h1 {
3415    line-height: 1;
3416    margin: 0;
3417  }
3418  .components-modal__header .components-button {
3419    position: relative;
3420    left: 8px;
3421  }
3422  
3423  .components-modal__header-heading-container {
3424    align-items: center;
3425    flex-grow: 1;
3426    display: flex;
3427    flex-direction: row;
3428    justify-content: left;
3429  }
3430  
3431  .components-modal__header-icon-container {
3432    display: inline-block;
3433  }
3434  .components-modal__header-icon-container svg {
3435    max-width: 36px;
3436    max-height: 36px;
3437    padding: 8px;
3438  }
3439  
3440  .components-modal__content {
3441    box-sizing: border-box;
3442    height: 100%;
3443    padding: 0 32px 24px;
3444  }
3445  @supports (-ms-ime-align: auto) {
3446    .components-modal__content {
3447      padding-top: 60px;
3448    }
3449  }
3450  
3451  .components-notice {
3452    display: flex;
3453    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3454    font-size: 13px;
3455    background-color: #fff;
3456    border-left: 4px solid var(--wp-admin-theme-color);
3457    margin: 5px 15px 2px;
3458    padding: 8px 12px;
3459    align-items: center;
3460  }
3461  .components-notice.is-dismissible {
3462    padding-right: 36px;
3463    position: relative;
3464  }
3465  .components-notice.is-success {
3466    border-left-color: #4ab866;
3467    background-color: #eff9f1;
3468  }
3469  .components-notice.is-warning {
3470    border-left-color: #f0b849;
3471    background-color: #fef8ee;
3472  }
3473  .components-notice.is-error {
3474    border-left-color: #cc1818;
3475    background-color: #f4a2a2;
3476  }
3477  
3478  .components-notice__content {
3479    flex-grow: 1;
3480    margin: 4px 25px 4px 0;
3481  }
3482  
3483  .components-notice__actions {
3484    display: flex;
3485    flex-wrap: wrap;
3486  }
3487  
3488  .components-notice__action.components-button {
3489    margin-right: 8px;
3490  }
3491  .components-notice__action.components-button, .components-notice__action.components-button.is-link {
3492    margin-left: 12px;
3493  }
3494  .components-notice__action.components-button.is-secondary {
3495    vertical-align: initial;
3496  }
3497  
3498  .components-notice__dismiss {
3499    color: #757575;
3500    align-self: flex-start;
3501    flex-shrink: 0;
3502  }
3503  .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 {
3504    color: #1e1e1e;
3505    background-color: transparent;
3506  }
3507  .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):hover {
3508    box-shadow: none;
3509  }
3510  
3511  .components-notice-list {
3512    max-width: 100vw;
3513    box-sizing: border-box;
3514  }
3515  .components-notice-list .components-notice__content {
3516    margin-top: 12px;
3517    margin-bottom: 12px;
3518    line-height: 2;
3519  }
3520  .components-notice-list .components-notice__action.components-button {
3521    display: block;
3522    margin-left: 0;
3523    margin-top: 8px;
3524  }
3525  
3526  .components-panel {
3527    background: #fff;
3528    border: 1px solid #e0e0e0;
3529  }
3530  .components-panel > .components-panel__header:first-child,
3531  .components-panel > .components-panel__body:first-child {
3532    margin-top: -1px;
3533  }
3534  .components-panel > .components-panel__header:last-child,
3535  .components-panel > .components-panel__body:last-child {
3536    border-bottom-width: 0;
3537  }
3538  
3539  .components-panel + .components-panel {
3540    margin-top: -1px;
3541  }
3542  
3543  .components-panel__body {
3544    border-top: 1px solid #e0e0e0;
3545    border-bottom: 1px solid #e0e0e0;
3546  }
3547  .components-panel__body h3 {
3548    margin: 0 0 0.5em;
3549  }
3550  .components-panel__body.is-opened {
3551    padding: 16px;
3552  }
3553  
3554  .components-panel__header {
3555    display: flex;
3556    justify-content: space-between;
3557    align-items: center;
3558    padding: 0 16px;
3559    height: 48px;
3560    border-top: 1px solid #ddd;
3561    border-bottom: 1px solid #ddd;
3562  }
3563  .components-panel__header h2 {
3564    margin: 0;
3565    font-size: inherit;
3566    color: inherit;
3567  }
3568  
3569  .components-panel__body + .components-panel__body,
3570  .components-panel__body + .components-panel__header,
3571  .components-panel__header + .components-panel__body,
3572  .components-panel__header + .components-panel__header {
3573    margin-top: -1px;
3574  }
3575  
3576  .components-panel__body > .components-panel__body-title {
3577    display: block;
3578    padding: 0;
3579    font-size: inherit;
3580    margin-top: 0;
3581    margin-bottom: 0;
3582    transition: 0.1s background ease-in-out;
3583  }
3584  @media (prefers-reduced-motion: reduce) {
3585    .components-panel__body > .components-panel__body-title {
3586      transition-duration: 0s;
3587      transition-delay: 0s;
3588    }
3589  }
3590  
3591  .components-panel__body.is-opened > .components-panel__body-title {
3592    margin: -16px;
3593    margin-bottom: 5px;
3594  }
3595  
3596  .components-panel__body > .components-panel__body-title:hover {
3597    background: #f0f0f0;
3598    border: none;
3599  }
3600  
3601  .components-panel__body-toggle.components-button {
3602    position: relative;
3603    padding: 16px 48px 16px 16px;
3604    outline: none;
3605    width: 100%;
3606    font-weight: 500;
3607    text-align: left;
3608    color: #1e1e1e;
3609    border: none;
3610    box-shadow: none;
3611    transition: 0.1s background ease-in-out;
3612    height: auto;
3613    /* rtl:begin:ignore */
3614    /* rtl:end:ignore */
3615  }
3616  @media (prefers-reduced-motion: reduce) {
3617    .components-panel__body-toggle.components-button {
3618      transition-duration: 0s;
3619      transition-delay: 0s;
3620    }
3621  }
3622  .components-panel__body-toggle.components-button:focus {
3623    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
3624    border-radius: 0;
3625  }
3626  .components-panel__body-toggle.components-button .components-panel__arrow {
3627    position: absolute;
3628    right: 16px;
3629    top: 50%;
3630    transform: translateY(-50%);
3631    color: #1e1e1e;
3632    fill: currentColor;
3633    transition: 0.1s color ease-in-out;
3634  }
3635  @media (prefers-reduced-motion: reduce) {
3636    .components-panel__body-toggle.components-button .components-panel__arrow {
3637      transition-duration: 0s;
3638      transition-delay: 0s;
3639    }
3640  }
3641  body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right {
3642    transform: scaleX(-1);
3643    -ms-filter: fliph;
3644    filter: FlipH;
3645    margin-top: -10px;
3646  }
3647  
3648  .components-panel__icon {
3649    color: #757575;
3650    margin: -2px 0 -2px 6px;
3651  }
3652  
3653  .components-panel__body-toggle-icon {
3654    margin-right: -5px;
3655  }
3656  
3657  .components-panel__color-title {
3658    float: left;
3659    height: 19px;
3660  }
3661  
3662  .components-panel__row {
3663    display: flex;
3664    justify-content: space-between;
3665    align-items: center;
3666    margin-top: 8px;
3667    min-height: 36px;
3668  }
3669  .components-panel__row select {
3670    min-width: 0;
3671  }
3672  .components-panel__row label {
3673    margin-right: 12px;
3674    flex-shrink: 0;
3675    max-width: 75%;
3676  }
3677  .components-panel__row:empty, .components-panel__row:first-of-type {
3678    margin-top: 0;
3679  }
3680  
3681  .components-panel .circle-picker {
3682    padding-bottom: 20px;
3683  }
3684  
3685  .components-placeholder.components-placeholder {
3686    box-sizing: border-box;
3687    position: relative;
3688    padding: 1em;
3689    min-height: 200px;
3690    width: 100%;
3691    text-align: left;
3692    margin: 0;
3693    color: #1e1e1e;
3694    -moz-font-smoothing: subpixel-antialiased;
3695    -webkit-font-smoothing: subpixel-antialiased;
3696    border-radius: 2px;
3697    background-color: #fff;
3698    box-shadow: inset 0 0 0 1px #1e1e1e;
3699    outline: 1px solid transparent;
3700  }
3701  @supports (position: sticky) {
3702    .components-placeholder.components-placeholder {
3703      display: flex;
3704      flex-direction: column;
3705      justify-content: center;
3706      align-items: flex-start;
3707    }
3708  }
3709  .components-placeholder.components-placeholder .components-base-control__label {
3710    font-size: 13px;
3711  }
3712  
3713  .components-placeholder__error,
3714  .components-placeholder__instructions,
3715  .components-placeholder__label,
3716  .components-placeholder__fieldset {
3717    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3718    font-size: 13px;
3719  }
3720  
3721  .components-placeholder__label {
3722    display: flex;
3723    font-weight: 600;
3724    margin-bottom: 16px;
3725    align-items: center;
3726  }
3727  .components-placeholder__label > svg,
3728  .components-placeholder__label .dashicon,
3729  .components-placeholder__label .block-editor-block-icon {
3730    fill: currentColor;
3731    margin-right: 1ch;
3732  }
3733  .components-placeholder__label:empty {
3734    display: none;
3735  }
3736  
3737  .components-placeholder__fieldset,
3738  .components-placeholder__fieldset form {
3739    display: flex;
3740    flex-direction: row;
3741    width: 100%;
3742    flex-wrap: wrap;
3743  }
3744  .components-placeholder__fieldset p,
3745  .components-placeholder__fieldset form p {
3746    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3747    font-size: 13px;
3748  }
3749  
3750  .components-placeholder__fieldset.is-column-layout,
3751  .components-placeholder__fieldset.is-column-layout form {
3752    flex-direction: column;
3753  }
3754  
3755  .components-placeholder__input[type=url] {
3756    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
3757    padding: 6px 8px;
3758    box-shadow: 0 0 0 transparent;
3759    transition: box-shadow 0.1s linear;
3760    border-radius: 2px;
3761    border: 1px solid #757575;
3762    /* Fonts smaller than 16px causes mobile safari to zoom. */
3763    font-size: 16px;
3764    /* Override core line-height. To be reviewed. */
3765    line-height: normal;
3766    margin: 0 8px 0 0;
3767    flex: 1 1 auto;
3768  }
3769  @media (prefers-reduced-motion: reduce) {
3770    .components-placeholder__input[type=url] {
3771      transition-duration: 0s;
3772      transition-delay: 0s;
3773    }
3774  }
3775  @media (min-width: 600px) {
3776    .components-placeholder__input[type=url] {
3777      font-size: 13px;
3778      /* Override core line-height. To be reviewed. */
3779      line-height: normal;
3780    }
3781  }
3782  .components-placeholder__input[type=url]:focus {
3783    border-color: var(--wp-admin-theme-color);
3784    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
3785    outline: 2px solid transparent;
3786  }
3787  .components-placeholder__input[type=url]::-webkit-input-placeholder {
3788    color: rgba(30, 30, 30, 0.62);
3789  }
3790  .components-placeholder__input[type=url]::-moz-placeholder {
3791    opacity: 1;
3792    color: rgba(30, 30, 30, 0.62);
3793  }
3794  .components-placeholder__input[type=url]:-ms-input-placeholder {
3795    color: rgba(30, 30, 30, 0.62);
3796  }
3797  
3798  .components-placeholder__instructions {
3799    margin-bottom: 1em;
3800  }
3801  
3802  .components-placeholder__error {
3803    margin-top: 1em;
3804    width: 100%;
3805  }
3806  
3807  .components-placeholder__preview img {
3808    margin: 3%;
3809    width: 50%;
3810  }
3811  
3812  .components-placeholder__fieldset .components-button {
3813    margin-right: 12px;
3814    margin-bottom: 12px;
3815  }
3816  .components-placeholder__fieldset .components-button:last-child {
3817    margin-bottom: 0;
3818    margin-right: 0;
3819  }
3820  
3821  .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link {
3822    margin-left: 10px;
3823    margin-right: 10px;
3824  }
3825  .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link:last-child {
3826    margin-right: 0;
3827  }
3828  
3829  .components-placeholder.is-large .components-placeholder__label {
3830    font-size: 18pt;
3831    font-weight: normal;
3832  }
3833  .components-placeholder.is-medium .components-placeholder__instructions, .components-placeholder.is-small .components-placeholder__instructions {
3834    display: none;
3835  }
3836  .components-placeholder.is-medium .components-placeholder__fieldset,
3837  .components-placeholder.is-medium .components-placeholder__fieldset form, .components-placeholder.is-small .components-placeholder__fieldset,
3838  .components-placeholder.is-small .components-placeholder__fieldset form {
3839    flex-direction: column;
3840  }
3841  .components-placeholder.is-medium .components-placeholder__fieldset .components-button, .components-placeholder.is-small .components-placeholder__fieldset .components-button {
3842    margin-right: auto;
3843  }
3844  .components-placeholder.is-small .components-button {
3845    padding: 0 8px 2px;
3846  }
3847  
3848  /*!rtl:begin:ignore*/
3849  .components-popover {
3850    position: fixed;
3851    z-index: 1000000;
3852    top: 0;
3853    left: 0;
3854    opacity: 0;
3855  }
3856  .components-popover.is-expanded, .components-popover[data-x-axis][data-y-axis] {
3857    opacity: 1;
3858  }
3859  .components-popover.is-expanded {
3860    top: 0;
3861    left: 0;
3862    right: 0;
3863    bottom: 0;
3864    z-index: 1000000 !important;
3865  }
3866  .components-popover:not(.is-without-arrow) {
3867    margin-left: 2px;
3868  }
3869  .components-popover:not(.is-without-arrow)::before {
3870    border: 8px solid #ccc;
3871  }
3872  .components-popover:not(.is-without-arrow).is-alternate::before {
3873    border-color: #1e1e1e;
3874  }
3875  .components-popover:not(.is-without-arrow)::after {
3876    border: 8px solid #fff;
3877  }
3878  .components-popover:not(.is-without-arrow)::before, .components-popover:not(.is-without-arrow)::after {
3879    content: "";
3880    position: absolute;
3881    height: 0;
3882    width: 0;
3883    line-height: 0;
3884  }
3885  .components-popover:not(.is-without-arrow)[data-y-axis=top] {
3886    margin-top: -8px;
3887  }
3888  .components-popover:not(.is-without-arrow)[data-y-axis=top]::before {
3889    bottom: -8px;
3890  }
3891  .components-popover:not(.is-without-arrow)[data-y-axis=top]::after {
3892    bottom: -6px;
3893  }
3894  .components-popover:not(.is-without-arrow)[data-y-axis=top]::before, .components-popover:not(.is-without-arrow)[data-y-axis=top]::after {
3895    border-bottom: none;
3896    border-left-color: transparent;
3897    border-right-color: transparent;
3898    border-top-style: solid;
3899    margin-left: -10px;
3900  }
3901  .components-popover:not(.is-without-arrow)[data-y-axis=bottom] {
3902    margin-top: 8px;
3903  }
3904  .components-popover:not(.is-without-arrow)[data-y-axis=bottom]::before {
3905    top: -8px;
3906  }
3907  .components-popover:not(.is-without-arrow)[data-y-axis=bottom]::after {
3908    top: -6px;
3909  }
3910  .components-popover:not(.is-without-arrow)[data-y-axis=bottom]::before, .components-popover:not(.is-without-arrow)[data-y-axis=bottom]::after {
3911    border-bottom-style: solid;
3912    border-left-color: transparent;
3913    border-right-color: transparent;
3914    border-top: none;
3915    margin-left: -10px;
3916  }
3917  .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=left] {
3918    margin-left: -8px;
3919  }
3920  .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=left]::before {
3921    right: -8px;
3922  }
3923  .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=left]::after {
3924    right: -6px;
3925  }
3926  .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 {
3927    border-bottom-color: transparent;
3928    border-left-style: solid;
3929    border-right: none;
3930    border-top-color: transparent;
3931  }
3932  .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=right] {
3933    margin-left: 8px;
3934  }
3935  .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=right]::before {
3936    left: -8px;
3937  }
3938  .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=right]::after {
3939    left: -6px;
3940  }
3941  .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 {
3942    border-bottom-color: transparent;
3943    border-left: none;
3944    border-right-style: solid;
3945    border-top-color: transparent;
3946  }
3947  .components-popover[data-y-axis=top] {
3948    bottom: 100%;
3949  }
3950  .components-popover[data-y-axis=bottom] {
3951    top: 100%;
3952  }
3953  .components-popover[data-y-axis=middle] {
3954    align-items: center;
3955    display: flex;
3956  }
3957  .components-popover.is-from-top {
3958    margin-top: 12px;
3959  }
3960  .components-popover.is-from-bottom {
3961    margin-top: -12px;
3962  }
3963  .components-popover.is-from-left:not(.is-from-top):not(.is-from-bottom) {
3964    margin-left: 12px;
3965  }
3966  .components-popover.is-from-right:not(.is-from-top):not(.is-from-bottom) {
3967    margin-right: 12px;
3968  }
3969  
3970  .components-popover__content {
3971    height: 100%;
3972    background: #fff;
3973    border: 1px solid #ccc;
3974    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
3975    border-radius: 2px;
3976  }
3977  .is-alternate .components-popover__content {
3978    border: 1px solid #1e1e1e;
3979    box-shadow: none;
3980  }
3981  .components-popover .components-popover__content {
3982    position: absolute;
3983    height: auto;
3984    overflow-y: auto;
3985  }
3986  .components-popover.is-expanded .components-popover__content {
3987    position: static;
3988    height: calc(100% - 48px);
3989    overflow-y: visible;
3990    min-width: auto;
3991    border: none;
3992    border-top: 1px solid #1e1e1e;
3993  }
3994  .components-popover[data-y-axis=top] .components-popover__content {
3995    bottom: 100%;
3996  }
3997  .components-popover[data-x-axis=center] .components-popover__content {
3998    left: 50%;
3999    transform: translateX(-50%);
4000  }
4001  .components-popover[data-x-axis=right] .components-popover__content {
4002    position: absolute;
4003    left: 100%;
4004  }
4005  .components-popover:not([data-y-axis=middle])[data-x-axis=right] .components-popover__content {
4006    margin-left: -25px;
4007  }
4008  .components-popover[data-x-axis=left] .components-popover__content {
4009    position: absolute;
4010    right: 100%;
4011  }
4012  .components-popover:not([data-y-axis=middle])[data-x-axis=left] .components-popover__content {
4013    margin-right: -25px;
4014  }
4015  
4016  .components-popover__header {
4017    align-items: center;
4018    background: #fff;
4019    display: flex;
4020    height: 48px;
4021    justify-content: space-between;
4022    padding: 0 8px 0 16px;
4023  }
4024  
4025  .components-popover__header-title {
4026    overflow: hidden;
4027    text-overflow: ellipsis;
4028    white-space: nowrap;
4029    width: 100%;
4030  }
4031  
4032  .components-popover__close.components-button {
4033    z-index: 5;
4034  }
4035  
4036  /*!rtl:end:ignore*/
4037  .components-radio-control {
4038    display: flex;
4039    flex-direction: column;
4040  }
4041  .components-radio-control .components-base-control__help {
4042    margin-top: 0;
4043  }
4044  .components-radio-control .components-base-control__field {
4045    margin-bottom: 0;
4046  }
4047  
4048  .components-radio-control__option:not(:last-child) {
4049    margin-bottom: 4px;
4050  }
4051  
4052  .components-radio-control__input[type=radio] {
4053    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4054    padding: 6px 8px;
4055    box-shadow: 0 0 0 transparent;
4056    transition: box-shadow 0.1s linear;
4057    border-radius: 2px;
4058    border: 1px solid #757575;
4059    /* Fonts smaller than 16px causes mobile safari to zoom. */
4060    font-size: 16px;
4061    /* Override core line-height. To be reviewed. */
4062    line-height: normal;
4063    border: 1px solid #1e1e1e;
4064    margin-right: 12px;
4065    transition: none;
4066    border-radius: 50%;
4067    width: 24px;
4068    height: 24px;
4069    margin-top: 0;
4070    margin-right: 6px;
4071  }
4072  @media (prefers-reduced-motion: reduce) {
4073    .components-radio-control__input[type=radio] {
4074      transition-duration: 0s;
4075      transition-delay: 0s;
4076    }
4077  }
4078  @media (min-width: 600px) {
4079    .components-radio-control__input[type=radio] {
4080      font-size: 13px;
4081      /* Override core line-height. To be reviewed. */
4082      line-height: normal;
4083    }
4084  }
4085  .components-radio-control__input[type=radio]:focus {
4086    border-color: var(--wp-admin-theme-color);
4087    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
4088    outline: 2px solid transparent;
4089  }
4090  .components-radio-control__input[type=radio]::-webkit-input-placeholder {
4091    color: rgba(30, 30, 30, 0.62);
4092  }
4093  .components-radio-control__input[type=radio]::-moz-placeholder {
4094    opacity: 1;
4095    color: rgba(30, 30, 30, 0.62);
4096  }
4097  .components-radio-control__input[type=radio]:-ms-input-placeholder {
4098    color: rgba(30, 30, 30, 0.62);
4099  }
4100  @media (min-width: 600px) {
4101    .components-radio-control__input[type=radio] {
4102      height: 20px;
4103      width: 20px;
4104    }
4105  }
4106  .components-radio-control__input[type=radio]:checked::before {
4107    box-sizing: inherit;
4108    width: 8px;
4109    height: 8px;
4110    transform: translate(7px, 7px);
4111    margin: 0;
4112    background-color: #fff;
4113    border: 4px solid #fff;
4114  }
4115  @media (min-width: 600px) {
4116    .components-radio-control__input[type=radio]:checked::before {
4117      transform: translate(5px, 5px);
4118    }
4119  }
4120  .components-radio-control__input[type=radio]:focus {
4121    box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
4122    outline: 2px solid transparent;
4123  }
4124  .components-radio-control__input[type=radio]:checked {
4125    background: var(--wp-admin-theme-color);
4126    border-color: var(--wp-admin-theme-color);
4127  }
4128  
4129  .components-resizable-box__handle {
4130    display: none;
4131    width: 23px;
4132    height: 23px;
4133    z-index: 2;
4134  }
4135  .components-resizable-box__container.has-show-handle .components-resizable-box__handle {
4136    display: block;
4137  }
4138  
4139  .components-resizable-box__handle::after {
4140    display: block;
4141    content: "";
4142    width: 15px;
4143    height: 15px;
4144    border: 2px solid var(--wp-admin-theme-color);
4145    border-radius: 50%;
4146    background: #fff;
4147    cursor: inherit;
4148    position: absolute;
4149    top: calc(50% - 8px);
4150    right: calc(50% - 8px);
4151  }
4152  
4153  .components-resizable-box__side-handle::before {
4154    display: block;
4155    border-radius: 2px;
4156    content: "";
4157    width: 3px;
4158    height: 3px;
4159    background: var(--wp-admin-theme-color);
4160    cursor: inherit;
4161    position: absolute;
4162    top: calc(50% - 1px);
4163    right: calc(50% - 1px);
4164    transition: transform 0.1s ease-in;
4165    opacity: 0;
4166  }
4167  @media (prefers-reduced-motion: reduce) {
4168    .components-resizable-box__side-handle::before {
4169      transition-duration: 0s;
4170      transition-delay: 0s;
4171    }
4172  }
4173  
4174  .components-resizable-box__side-handle {
4175    z-index: 2;
4176  }
4177  
4178  .components-resizable-box__corner-handle {
4179    z-index: 2;
4180  }
4181  
4182  .components-resizable-box__side-handle.components-resizable-box__handle-top,
4183  .components-resizable-box__side-handle.components-resizable-box__handle-bottom,
4184  .components-resizable-box__side-handle.components-resizable-box__handle-top::before,
4185  .components-resizable-box__side-handle.components-resizable-box__handle-bottom::before {
4186    width: 100%;
4187    left: 0;
4188    border-left: 0;
4189    border-right: 0;
4190  }
4191  
4192  .components-resizable-box__side-handle.components-resizable-box__handle-left,
4193  .components-resizable-box__side-handle.components-resizable-box__handle-right,
4194  .components-resizable-box__side-handle.components-resizable-box__handle-left::before,
4195  .components-resizable-box__side-handle.components-resizable-box__handle-right::before {
4196    height: 100%;
4197    top: 0;
4198    border-top: 0;
4199    border-bottom: 0;
4200  }
4201  
4202  .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before,
4203  .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before,
4204  .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before,
4205  .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before {
4206    animation: components-resizable-box__top-bottom-animation 0.1s ease-out 0s;
4207    animation-fill-mode: forwards;
4208  }
4209  @media (prefers-reduced-motion: reduce) {
4210    .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before,
4211  .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before,
4212  .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before,
4213  .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before {
4214      animation-duration: 1ms;
4215      animation-delay: 0s;
4216    }
4217  }
4218  
4219  .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before,
4220  .components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before,
4221  .components-resizable-box__side-handle.components-resizable-box__handle-left:active::before,
4222  .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before {
4223    animation: components-resizable-box__left-right-animation 0.1s ease-out 0s;
4224    animation-fill-mode: forwards;
4225  }
4226  @media (prefers-reduced-motion: reduce) {
4227    .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before,
4228  .components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before,
4229  .components-resizable-box__side-handle.components-resizable-box__handle-left:active::before,
4230  .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before {
4231      animation-duration: 1ms;
4232      animation-delay: 0s;
4233    }
4234  }
4235  
4236  /* This CSS is shown only to Safari, which has a bug with table-caption making it jumpy.
4237  See https://bugs.webkit.org/show_bug.cgi?id=187903. */
4238  @media not all and (-webkit-min-device-pixel-ratio: 0), not all and (min-resolution: 0.001dpcm) {
4239    @supports (-webkit-appearance: none) {
4240      .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before,
4241  .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before,
4242  .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before,
4243  .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before {
4244        animation: none;
4245      }
4246  
4247      .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before,
4248  .components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before,
4249  .components-resizable-box__side-handle.components-resizable-box__handle-left:active::before,
4250  .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before {
4251        animation: none;
4252      }
4253    }
4254  }
4255  @keyframes components-resizable-box__top-bottom-animation {
4256    from {
4257      transform: scaleX(0);
4258      opacity: 0;
4259    }
4260    to {
4261      transform: scaleX(1);
4262      opacity: 1;
4263    }
4264  }
4265  @keyframes components-resizable-box__left-right-animation {
4266    from {
4267      transform: scaleY(0);
4268      opacity: 0;
4269    }
4270    to {
4271      transform: scaleY(1);
4272      opacity: 1;
4273    }
4274  }
4275  /*!rtl:begin:ignore*/
4276  .components-resizable-box__handle-right {
4277    right: calc(11.5px * -1);
4278  }
4279  
4280  .components-resizable-box__handle-left {
4281    left: calc(11.5px * -1);
4282  }
4283  
4284  .components-resizable-box__handle-top {
4285    top: calc(11.5px * -1);
4286  }
4287  
4288  .components-resizable-box__handle-bottom {
4289    bottom: calc(11.5px * -1);
4290  }
4291  
4292  /*!rtl:end:ignore*/
4293  .components-responsive-wrapper {
4294    position: relative;
4295    max-width: 100%;
4296  }
4297  .components-responsive-wrapper, .components-responsive-wrapper > span {
4298    display: block;
4299  }
4300  
4301  .components-responsive-wrapper__content {
4302    position: absolute;
4303    top: 0;
4304    right: 0;
4305    bottom: 0;
4306    left: 0;
4307    width: 100%;
4308    height: 100%;
4309    margin: auto;
4310  }
4311  
4312  .components-sandbox {
4313    overflow: hidden;
4314  }
4315  
4316  iframe.components-sandbox {
4317    width: 100%;
4318  }
4319  
4320  html.lockscroll,
4321  body.lockscroll {
4322    overflow: hidden;
4323  }
4324  
4325  .components-select-control__input {
4326    background: #fff;
4327    height: 36px;
4328    line-height: 36px;
4329    margin: 1px;
4330    outline: 0;
4331    width: 100%;
4332    -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
4333  }
4334  @media (min-width: 782px) {
4335    .components-select-control__input {
4336      height: 28px;
4337      line-height: 28px;
4338    }
4339  }
4340  
4341  @media (max-width: 782px) {
4342    .components-base-control .components-base-control__field .components-select-control__input {
4343      font-size: 16px;
4344    }
4345  }
4346  .components-snackbar {
4347    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4348    font-size: 13px;
4349    background-color: #1e1e1e;
4350    border-radius: 2px;
4351    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
4352    color: #fff;
4353    padding: 16px 24px;
4354    width: 100%;
4355    max-width: 600px;
4356    box-sizing: border-box;
4357    cursor: pointer;
4358    pointer-events: auto;
4359  }
4360  @media (min-width: 600px) {
4361    .components-snackbar {
4362      width: -moz-fit-content;
4363      width: fit-content;
4364    }
4365  }
4366  .components-snackbar:focus {
4367    box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--wp-admin-theme-color);
4368  }
4369  .components-snackbar.components-snackbar-explicit-dismiss {
4370    cursor: default;
4371  }
4372  .components-snackbar .components-snackbar__content-with-icon {
4373    margin-left: 24px;
4374  }
4375  .components-snackbar .components-snackbar__icon {
4376    position: absolute;
4377    top: 24px;
4378    left: 28px;
4379  }
4380  .components-snackbar .components-snackbar__dismiss-button {
4381    margin-left: 32px;
4382    cursor: pointer;
4383  }
4384  
4385  .components-snackbar__action.components-button {
4386    margin-left: 32px;
4387    color: #fff;
4388    height: auto;
4389    flex-shrink: 0;
4390    line-height: 1.4;
4391    padding: 0;
4392  }
4393  .components-snackbar__action.components-button:not(:disabled):not([aria-disabled=true]):not(.is-secondary) {
4394    text-decoration: underline;
4395    background-color: transparent;
4396  }
4397  .components-snackbar__action.components-button:not(:disabled):not([aria-disabled=true]):not(.is-secondary):focus {
4398    color: #fff;
4399    box-shadow: none;
4400    outline: 1px dotted #fff;
4401  }
4402  .components-snackbar__action.components-button:not(:disabled):not([aria-disabled=true]):not(.is-secondary):hover {
4403    color: var(--wp-admin-theme-color);
4404  }
4405  
4406  .components-snackbar__content {
4407    display: flex;
4408    align-items: baseline;
4409    justify-content: space-between;
4410    line-height: 1.4;
4411  }
4412  
4413  .components-snackbar-list {
4414    position: absolute;
4415    z-index: 100000;
4416    width: 100%;
4417    box-sizing: border-box;
4418    pointer-events: none;
4419  }
4420  
4421  .components-snackbar-list__notice-container {
4422    position: relative;
4423    padding-top: 8px;
4424  }
4425  
4426  .components-swatch {
4427    width: 18px;
4428    height: 18px;
4429    border-radius: 50%;
4430    color: transparent;
4431    background: transparent;
4432  }
4433  .components-swatch::after {
4434    content: "";
4435    display: block;
4436    width: 100%;
4437    height: 100%;
4438    border: 1px solid rgba(0, 0, 0, 0.2);
4439    border-radius: 50%;
4440  }
4441  
4442  .components-button.has-icon.has-text .components-swatch {
4443    margin-right: 8px;
4444  }
4445  
4446  .components-tab-panel__tabs {
4447    display: flex;
4448    align-items: stretch;
4449    flex-direction: row;
4450  }
4451  .components-tab-panel__tabs[aria-orientation=vertical] {
4452    flex-direction: column;
4453  }
4454  
4455  .components-tab-panel__tabs-item {
4456    background: transparent;
4457    border: none;
4458    box-shadow: none;
4459    border-radius: 0;
4460    cursor: pointer;
4461    height: 48px;
4462    padding: 3px 16px;
4463    margin-left: 0;
4464    font-weight: 500;
4465    transition: box-shadow 0.1s linear;
4466    box-sizing: border-box;
4467  }
4468  .components-tab-panel__tabs-item::after {
4469    content: attr(data-label);
4470    display: block;
4471    height: 0;
4472    overflow: hidden;
4473    speak: none;
4474    visibility: hidden;
4475  }
4476  .components-tab-panel__tabs-item:focus:not(:disabled) {
4477    box-shadow: inset 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
4478  }
4479  .components-tab-panel__tabs-item.is-active {
4480    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) transparent, inset 0 -4px 0 0 var(--wp-admin-theme-color);
4481    position: relative;
4482  }
4483  .components-tab-panel__tabs-item.is-active::before {
4484    content: "";
4485    position: absolute;
4486    top: 0;
4487    bottom: 1px;
4488    right: 0;
4489    left: 0;
4490    border-bottom: 4px solid transparent;
4491  }
4492  .components-tab-panel__tabs-item:focus {
4493    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
4494  }
4495  .components-tab-panel__tabs-item.is-active:focus {
4496    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 -4px 0 0 var(--wp-admin-theme-color);
4497  }
4498  
4499  .components-text-control__input,
4500  .components-text-control__input[type=text],
4501  .components-text-control__input[type=tel],
4502  .components-text-control__input[type=time],
4503  .components-text-control__input[type=url],
4504  .components-text-control__input[type=week],
4505  .components-text-control__input[type=password],
4506  .components-text-control__input[type=color],
4507  .components-text-control__input[type=date],
4508  .components-text-control__input[type=datetime],
4509  .components-text-control__input[type=datetime-local],
4510  .components-text-control__input[type=email],
4511  .components-text-control__input[type=month],
4512  .components-text-control__input[type=number] {
4513    width: 100%;
4514    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4515    padding: 6px 8px;
4516    box-shadow: 0 0 0 transparent;
4517    transition: box-shadow 0.1s linear;
4518    border-radius: 2px;
4519    border: 1px solid #757575;
4520    /* Fonts smaller than 16px causes mobile safari to zoom. */
4521    font-size: 16px;
4522    /* Override core line-height. To be reviewed. */
4523    line-height: normal;
4524  }
4525  @media (prefers-reduced-motion: reduce) {
4526    .components-text-control__input,
4527  .components-text-control__input[type=text],
4528  .components-text-control__input[type=tel],
4529  .components-text-control__input[type=time],
4530  .components-text-control__input[type=url],
4531  .components-text-control__input[type=week],
4532  .components-text-control__input[type=password],
4533  .components-text-control__input[type=color],
4534  .components-text-control__input[type=date],
4535  .components-text-control__input[type=datetime],
4536  .components-text-control__input[type=datetime-local],
4537  .components-text-control__input[type=email],
4538  .components-text-control__input[type=month],
4539  .components-text-control__input[type=number] {
4540      transition-duration: 0s;
4541      transition-delay: 0s;
4542    }
4543  }
4544  @media (min-width: 600px) {
4545    .components-text-control__input,
4546  .components-text-control__input[type=text],
4547  .components-text-control__input[type=tel],
4548  .components-text-control__input[type=time],
4549  .components-text-control__input[type=url],
4550  .components-text-control__input[type=week],
4551  .components-text-control__input[type=password],
4552  .components-text-control__input[type=color],
4553  .components-text-control__input[type=date],
4554  .components-text-control__input[type=datetime],
4555  .components-text-control__input[type=datetime-local],
4556  .components-text-control__input[type=email],
4557  .components-text-control__input[type=month],
4558  .components-text-control__input[type=number] {
4559      font-size: 13px;
4560      /* Override core line-height. To be reviewed. */
4561      line-height: normal;
4562    }
4563  }
4564  .components-text-control__input:focus,
4565  .components-text-control__input[type=text]:focus,
4566  .components-text-control__input[type=tel]:focus,
4567  .components-text-control__input[type=time]:focus,
4568  .components-text-control__input[type=url]:focus,
4569  .components-text-control__input[type=week]:focus,
4570  .components-text-control__input[type=password]:focus,
4571  .components-text-control__input[type=color]:focus,
4572  .components-text-control__input[type=date]:focus,
4573  .components-text-control__input[type=datetime]:focus,
4574  .components-text-control__input[type=datetime-local]:focus,
4575  .components-text-control__input[type=email]:focus,
4576  .components-text-control__input[type=month]:focus,
4577  .components-text-control__input[type=number]:focus {
4578    border-color: var(--wp-admin-theme-color);
4579    box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
4580    outline: 2px solid transparent;
4581  }
4582  .components-text-control__input::-webkit-input-placeholder,
4583  .components-text-control__input[type=text]::-webkit-input-placeholder,
4584  .components-text-control__input[type=tel]::-webkit-input-placeholder,
4585  .components-text-control__input[type=time]::-webkit-input-placeholder,
4586  .components-text-control__input[type=url]::-webkit-input-placeholder,
4587  .components-text-control__input[type=week]::-webkit-input-placeholder,
4588  .components-text-control__input[type=password]::-webkit-input-placeholder,
4589  .components-text-control__input[type=color]::-webkit-input-placeholder,
4590  .components-text-control__input[type=date]::-webkit-input-placeholder,
4591  .components-text-control__input[type=datetime]::-webkit-input-placeholder,
4592  .components-text-control__input[type=datetime-local]::-webkit-input-placeholder,
4593  .components-text-control__input[type=email]::-webkit-input-placeholder,
4594  .components-text-control__input[type=month]::-webkit-input-placeholder,
4595  .components-text-control__input[type=number]::-webkit-input-placeholder {
4596    color: rgba(30, 30, 30, 0.62);
4597  }
4598  .components-text-control__input::-moz-placeholder,
4599  .components-text-control__input[type=text]::-moz-placeholder,
4600  .components-text-control__input[type=tel]::-moz-placeholder,
4601  .components-text-control__input[type=time]::-moz-placeholder,
4602  .components-text-control__input[type=url]::-moz-placeholder,
4603  .components-text-control__input[type=week]::-moz-placeholder,
4604  .components-text-control__input[type=password]::-moz-placeholder,
4605  .components-text-control__input[type=color]::-moz-placeholder,
4606  .components-text-control__input[type=date]::-moz-placeholder,
4607  .components-text-control__input[type=datetime]::-moz-placeholder,
4608  .components-text-control__input[type=datetime-local]::-moz-placeholder,
4609  .components-text-control__input[type=email]::-moz-placeholder,
4610  .components-text-control__input[type=month]::-moz-placeholder,
4611  .components-text-control__input[type=number]::-moz-placeholder {
4612    opacity: 1;
4613    color: rgba(30, 30, 30, 0.62);
4614  }
4615  .components-text-control__input:-ms-input-placeholder,
4616  .components-text-control__input[type=text]:-ms-input-placeholder,
4617  .components-text-control__input[type=tel]:-ms-input-placeholder,
4618  .components-text-control__input[type=time]:-ms-input-placeholder,
4619  .components-text-control__input[type=url]:-ms-input-placeholder,
4620  .components-text-control__input[type=week]:-ms-input-placeholder,
4621  .components-text-control__input[type=password]:-ms-input-placeholder,
4622  .components-text-control__input[type=color]:-ms-input-placeholder,
4623  .components-text-control__input[type=date]:-ms-input-placeholder,
4624  .components-text-control__input[type=datetime]:-ms-input-placeholder,
4625  .components-text-control__input[type=datetime-local]:-ms-input-placeholder,
4626  .components-text-control__input[type=email]:-ms-input-placeholder,
4627  .components-text-control__input[type=month]:-ms-input-placeholder,
4628  .components-text-control__input[type=number]:-ms-input-placeholder {
4629    color: rgba(30, 30, 30, 0.62);
4630  }
4631  
4632  .components-tip {
4633    display: flex;
4634    color: #757575;
4635  }
4636  .components-tip svg {
4637    align-self: center;
4638    fill: #f0b849;
4639    flex-shrink: 0;
4640    margin-right: 16px;
4641  }
4642  .components-tip p {
4643    margin: 0;
4644  }
4645  
4646  .components-toggle-control .components-base-control__field {
4647    display: flex;
4648    margin-bottom: 12px;
4649    line-height: initial;
4650    align-items: center;
4651  }
4652  .components-toggle-control .components-base-control__field .components-form-toggle {
4653    margin-right: 12px;
4654  }
4655  .components-toggle-control .components-base-control__field .components-toggle-control__label {
4656    display: block;
4657  }
4658  
4659  .components-accessible-toolbar {
4660    display: inline-flex;
4661    border: 1px solid #1e1e1e;
4662    border-radius: 2px;
4663    flex-shrink: 0;
4664  }
4665  .components-accessible-toolbar > .components-toolbar-group:last-child {
4666    border-right: none;
4667  }
4668  
4669  .components-accessible-toolbar .components-button,
4670  .components-toolbar .components-button {
4671    position: relative;
4672    height: 48px;
4673    z-index: 1;
4674    padding-left: 16px;
4675    padding-right: 16px;
4676  }
4677  .components-accessible-toolbar .components-button:focus:enabled,
4678  .components-toolbar .components-button:focus:enabled {
4679    box-shadow: none;
4680    outline: none;
4681  }
4682  .components-accessible-toolbar .components-button::before,
4683  .components-toolbar .components-button::before {
4684    content: "";
4685    position: absolute;
4686    display: block;
4687    border-radius: 2px;
4688    height: 32px;
4689    left: 8px;
4690    right: 8px;
4691    z-index: -1;
4692    animation: components-button__appear-animation 0.1s ease;
4693    animation-fill-mode: forwards;
4694  }
4695  @media (prefers-reduced-motion: reduce) {
4696    .components-accessible-toolbar .components-button::before,
4697  .components-toolbar .components-button::before {
4698      animation-duration: 1ms;
4699      animation-delay: 0s;
4700    }
4701  }
4702  .components-accessible-toolbar .components-button svg,
4703  .components-toolbar .components-button svg {
4704    position: relative;
4705    margin-left: auto;
4706    margin-right: auto;
4707  }
4708  .components-accessible-toolbar .components-button.is-pressed,
4709  .components-toolbar .components-button.is-pressed {
4710    background: transparent;
4711  }
4712  .components-accessible-toolbar .components-button.is-pressed:hover,
4713  .components-toolbar .components-button.is-pressed:hover {
4714    background: transparent;
4715  }
4716  .components-accessible-toolbar .components-button.is-pressed::before,
4717  .components-toolbar .components-button.is-pressed::before {
4718    background: #1e1e1e;
4719  }
4720  .components-accessible-toolbar .components-button:focus::before,
4721  .components-toolbar .components-button:focus::before {
4722    box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 4px #fff;
4723    outline: 2px solid transparent;
4724  }
4725  .components-accessible-toolbar .components-button.has-icon,
4726  .components-toolbar .components-button.has-icon {
4727    padding-left: 8px;
4728    padding-right: 8px;
4729    min-width: 48px;
4730    justify-content: center;
4731  }
4732  .components-accessible-toolbar .components-button.components-tab-button,
4733  .components-toolbar .components-button.components-tab-button {
4734    font-weight: 500;
4735  }
4736  .components-accessible-toolbar .components-button.components-tab-button span,
4737  .components-toolbar .components-button.components-tab-button span {
4738    display: inline-block;
4739    padding-left: 0;
4740    padding-right: 0;
4741    position: relative;
4742  }
4743  
4744  @keyframes components-button__appear-animation {
4745    from {
4746      transform: scaleY(0);
4747    }
4748    to {
4749      transform: scaleY(1);
4750    }
4751  }
4752  .components-toolbar__control.components-button {
4753    position: relative;
4754  }
4755  .components-toolbar__control.components-button[data-subscript] svg {
4756    padding: 5px 10px 5px 0;
4757  }
4758  .components-toolbar__control.components-button[data-subscript]::after {
4759    content: attr(data-subscript);
4760    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4761    font-size: 13px;
4762    font-weight: 600;
4763    line-height: 12px;
4764    position: absolute;
4765    right: 8px;
4766    bottom: 10px;
4767  }
4768  .components-toolbar__control.components-button:active::before {
4769    display: none;
4770  }
4771  .components-toolbar__control.components-button:not(:disabled).is-pressed[data-subscript]::after {
4772    color: #fff;
4773  }
4774  
4775  .components-toolbar-group {
4776    min-height: 48px;
4777    border-right: 1px solid #1e1e1e;
4778    background-color: #fff;
4779    display: inline-flex;
4780    flex-shrink: 0;
4781    flex-wrap: wrap;
4782    line-height: 0;
4783  }
4784  .components-toolbar-group .components-toolbar-group.components-toolbar-group {
4785    border-width: 0;
4786    margin: 0;
4787  }
4788  
4789  .components-toolbar {
4790    min-height: 48px;
4791    margin: 0;
4792    border: 1px solid #1e1e1e;
4793    background-color: #fff;
4794    display: inline-flex;
4795    flex-shrink: 0;
4796    flex-wrap: wrap;
4797  }
4798  .components-toolbar .components-toolbar.components-toolbar {
4799    border-width: 0;
4800    margin: 0;
4801  }
4802  
4803  div.components-toolbar > div {
4804    display: block;
4805    margin: 0;
4806  }
4807  @supports (position: sticky) {
4808    div.components-toolbar > div {
4809      display: flex;
4810    }
4811  }
4812  div.components-toolbar > div + div.has-left-divider {
4813    margin-left: 6px;
4814    position: relative;
4815    overflow: visible;
4816  }
4817  div.components-toolbar > div + div.has-left-divider::before {
4818    display: inline-block;
4819    content: "";
4820    box-sizing: content-box;
4821    background-color: #ddd;
4822    position: absolute;
4823    top: 8px;
4824    left: -3px;
4825    width: 1px;
4826    height: 20px;
4827  }
4828  
4829  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:first-child:last-child,
4830  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:first-child:last-child .components-button, .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot.components-dropdown > .components-button.components-button, .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot.components-dropdown > * .components-button,
4831  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:first-child:last-child,
4832  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:first-child:last-child .components-button,
4833  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot.components-dropdown > .components-button.components-button,
4834  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot.components-dropdown > * .components-button,
4835  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:first-child:last-child,
4836  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:first-child:last-child .components-button,
4837  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar.components-dropdown > .components-button.components-button,
4838  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar.components-dropdown > * .components-button,
4839  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:first-child:last-child,
4840  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:first-child:last-child .components-button,
4841  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown.components-dropdown > .components-button.components-button,
4842  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown.components-dropdown > * .components-button,
4843  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:first-child:last-child,
4844  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:first-child:last-child .components-button,
4845  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group.components-dropdown > .components-button.components-button,
4846  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group.components-dropdown > * .components-button {
4847    min-width: 48px;
4848    padding-left: 12px;
4849    padding-right: 12px;
4850  }
4851  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:first-child:last-child::before,
4852  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:first-child:last-child .components-button::before, .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot.components-dropdown > .components-button.components-button::before, .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot.components-dropdown > * .components-button::before,
4853  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:first-child:last-child::before,
4854  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:first-child:last-child .components-button::before,
4855  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot.components-dropdown > .components-button.components-button::before,
4856  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot.components-dropdown > * .components-button::before,
4857  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:first-child:last-child::before,
4858  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:first-child:last-child .components-button::before,
4859  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar.components-dropdown > .components-button.components-button::before,
4860  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar.components-dropdown > * .components-button::before,
4861  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:first-child:last-child::before,
4862  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:first-child:last-child .components-button::before,
4863  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown.components-dropdown > .components-button.components-button::before,
4864  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown.components-dropdown > * .components-button::before,
4865  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:first-child:last-child::before,
4866  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:first-child:last-child .components-button::before,
4867  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group.components-dropdown > .components-button.components-button::before,
4868  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group.components-dropdown > * .components-button::before {
4869    left: 8px;
4870    right: 8px;
4871  }
4872  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:first-child,
4873  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div:first-child > .components-button,
4874  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:first-child .components-button,
4875  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:first-child,
4876  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div:first-child > .components-button,
4877  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:first-child .components-button,
4878  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:first-child,
4879  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div:first-child > .components-button,
4880  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:first-child .components-button,
4881  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:first-child,
4882  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div:first-child > .components-button,
4883  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:first-child .components-button,
4884  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:first-child,
4885  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div:first-child > .components-button,
4886  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:first-child .components-button {
4887    min-width: 42px;
4888    padding-left: 11px;
4889    padding-right: 6px;
4890  }
4891  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:first-child::before,
4892  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div:first-child > .components-button::before,
4893  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:first-child .components-button::before,
4894  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:first-child::before,
4895  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div:first-child > .components-button::before,
4896  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:first-child .components-button::before,
4897  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:first-child::before,
4898  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div:first-child > .components-button::before,
4899  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:first-child .components-button::before,
4900  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:first-child::before,
4901  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div:first-child > .components-button::before,
4902  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:first-child .components-button::before,
4903  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:first-child::before,
4904  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div:first-child > .components-button::before,
4905  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:first-child .components-button::before {
4906    left: 8px;
4907    right: 2px;
4908  }
4909  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button,
4910  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div > .components-button,
4911  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button,
4912  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button,
4913  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div > .components-button,
4914  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown .components-button,
4915  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button,
4916  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div > .components-button,
4917  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown .components-button,
4918  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button,
4919  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div > .components-button,
4920  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown .components-button,
4921  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button,
4922  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div > .components-button,
4923  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown .components-button {
4924    min-width: 36px;
4925    padding-left: 6px;
4926    padding-right: 6px;
4927  }
4928  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button svg,
4929  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div > .components-button svg,
4930  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button svg,
4931  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button svg,
4932  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div > .components-button svg,
4933  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown .components-button svg,
4934  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button svg,
4935  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div > .components-button svg,
4936  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown .components-button svg,
4937  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button svg,
4938  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div > .components-button svg,
4939  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown .components-button svg,
4940  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button svg,
4941  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div > .components-button svg,
4942  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown .components-button svg {
4943    min-width: 24px;
4944  }
4945  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button::before,
4946  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div > .components-button::before,
4947  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button::before,
4948  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button::before,
4949  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div > .components-button::before,
4950  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown .components-button::before,
4951  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button::before,
4952  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div > .components-button::before,
4953  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown .components-button::before,
4954  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button::before,
4955  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div > .components-button::before,
4956  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown .components-button::before,
4957  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button::before,
4958  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div > .components-button::before,
4959  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown .components-button::before {
4960    left: 2px;
4961    right: 2px;
4962  }
4963  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:last-child,
4964  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div:last-child > .components-button,
4965  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:last-child .components-button,
4966  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:last-child,
4967  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div:last-child > .components-button,
4968  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:last-child .components-button,
4969  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:last-child,
4970  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div:last-child > .components-button,
4971  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:last-child .components-button,
4972  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:last-child,
4973  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div:last-child > .components-button,
4974  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:last-child .components-button,
4975  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:last-child,
4976  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div:last-child > .components-button,
4977  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:last-child .components-button {
4978    min-width: 42px;
4979    padding-left: 6px;
4980    padding-right: 11px;
4981  }
4982  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:last-child::before,
4983  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div:last-child > .components-button::before,
4984  .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:last-child .components-button::before,
4985  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:last-child::before,
4986  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div:last-child > .components-button::before,
4987  .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:last-child .components-button::before,
4988  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:last-child::before,
4989  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div:last-child > .components-button::before,
4990  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:last-child .components-button::before,
4991  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:last-child::before,
4992  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div:last-child > .components-button::before,
4993  .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:last-child .components-button::before,
4994  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:last-child::before,
4995  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div:last-child > .components-button::before,
4996  .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:last-child .components-button::before {
4997    left: 2px;
4998    right: 8px;
4999  }
5000  
5001  .components-tooltip.components-popover {
5002    z-index: 1000002;
5003  }
5004  .components-tooltip.components-popover .components-popover__content {
5005    min-width: 0;
5006  }
5007  
5008  .components-tooltip .components-popover__content {
5009    background: #1e1e1e;
5010    border-radius: 2px;
5011    border-width: 0;
5012    color: #fff;
5013    white-space: nowrap;
5014    text-align: center;
5015    line-height: 1.4;
5016    font-size: 12px;
5017    box-shadow: none;
5018  }
5019  .components-tooltip .components-popover__content > div {
5020    padding: 4px 8px;
5021  }
5022  
5023  .components-tooltip__shortcut {
5024    display: inline-block;
5025    margin-left: 8px;
5026  }
5027  
5028  .disabled-element-wrapper {
5029    position: relative;
5030  }
5031  .disabled-element-wrapper .event-catcher {
5032    z-index: 100002;
5033    position: absolute;
5034    width: 100%;
5035    height: 100%;
5036    top: 0;
5037    left: 0;
5038    bottom: 0;
5039    right: 0;
5040  }
5041  
5042  .components-visually-hidden {
5043    border: 0;
5044    clip: rect(1px, 1px, 1px, 1px);
5045    -webkit-clip-path: inset(50%);
5046    clip-path: inset(50%);
5047    height: 1px;
5048    margin: -1px;
5049    overflow: hidden;
5050    padding: 0;
5051    position: absolute;
5052    width: 1px;
5053    word-wrap: normal !important;
5054  }
5055  
5056  .components-visually-hidden:focus {
5057    background-color: #ddd;
5058    clip: auto !important;
5059    -webkit-clip-path: none;
5060            clip-path: none;
5061    color: #444;
5062    display: block;
5063    font-size: 1em;
5064    height: auto;
5065    left: 5px;
5066    line-height: normal;
5067    padding: 15px 23px 14px;
5068    text-decoration: none;
5069    top: 5px;
5070    width: auto;
5071    z-index: 100000;
5072  }


Generated : Fri Mar 29 08:20:02 2024 Cross-referenced by PHPXref