From ea0cfd25976a445ba30e1fa7533c1caf8b36135a Mon Sep 17 00:00:00 2001 From: anomiex Date: Wed, 10 Nov 2021 22:47:38 +0000 Subject: [PATCH] Update wordpress monorepo (#21702) * Fix tweetstorm test for good It keeps flopping between 1 and 2, so accept either * Fix use of InnerBlocks.Content It looks like we were using it wrong, in a way that worked before https://github.com/WordPress/gutenberg/pull/26031 but breaks after. Co-authored-by: Renovate Bot Co-authored-by: matticbot Co-authored-by: Brad Jorsch Committed via a GitHub action: https://github.com/Automattic/jetpack/actions/runs/1446415445 --- CHANGELOG.md | 3 +++ build/index.asset.php | 2 +- build/index.css.map | 2 +- package.json | 6 +++--- 4 files changed, 8 insertions(+), 5 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e35fd5b..c9f8a03 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 This is an alpha version! The changes listed here are not final. +### Changed +- Updated package dependencies + ### Removed - Remove use of `gulp` in build, all it was doing was wrapping `webpack`. diff --git a/build/index.asset.php b/build/index.asset.php index 346d5dd..1e0f1ae 100644 --- a/build/index.asset.php +++ b/build/index.asset.php @@ -1 +1 @@ - array('lodash', 'react', 'react-dom', 'wp-components', 'wp-compose', 'wp-data', 'wp-element', 'wp-i18n', 'wp-polyfill'), 'version' => 'f4f442183483e20c027d3fa3604a8713'); \ No newline at end of file + array('lodash', 'react', 'react-dom', 'wp-components', 'wp-compose', 'wp-data', 'wp-element', 'wp-i18n', 'wp-polyfill'), 'version' => 'babf46a55bc3c8c3b156e599d222beb1'); \ No newline at end of file diff --git a/build/index.css.map b/build/index.css.map index 146a82b..1418d7c 100644 --- a/build/index.css.map +++ b/build/index.css.map @@ -1 +1 @@ -{"version":3,"file":"index.css","mappings":"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DD;AC9JC;EA+FD;IAQE;IACA;ED2DA;AACF;ACjKC;EA4FD;IAaE;IACA;IACA;ED4DA;AACF;;ACzDA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AD4DD;AC1DC;EACC;AD4DF;AC1DE;EACC;AD4DH;ACpDE;EACC;EACA;ADsDH;ACnDE;EACC;ADqDH;ACjDC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ADmDF;;AA3OA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AA8OD;AA5OC;EATD;IAUE;EA+OA;AACF;AA5OE;EACC;EACA;AA8OH;AA1OC;EACC;EACA;EACA;EACA;AA4OF;AAzOC;EACC;EACA;AA2OF;AAxOC;EAEC;EACA;EACA;EACA;EACA;EACA;AAyOF;AAtOC;EACC;EACA;EACA;AAwOF;AArOC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AAuOF;AApOC;EACC;AAsOF;AAnOC;EACC;EACA;EACA;EACA;AAqOF;AAlOC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AAoOF;AAjOC;EACC;EACA;EACA;AAmOF;AAhOC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAkOF;AA/NC;EACC;EACA;EACA;EACA;AAiOF,C;;;;ALzUA;;EAAA;ACAA;;;;;CAAA;ACEA;;EAAA;AAqDA;;;;;EAAA;AA8DA;;EAAA;AA8BA;;EAAA;AAqCA;;EAAA;AAqBA;;EAAA;AAyKA;;;EAAA;AAcA;;EAAA;AKjYA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAmCD;ALVC;EKlCD;IAYE;EAoCA;AACF;AAlCC;EACC;EACA;AAoCF;AAlCE;EACC;EACA;EACA;AAoCH;AAhCC;EACC;EACA;EACA;EACA;AAkCF;AA/BC;EACC;EACA;EACA;EACA;AAiCF;AA9BC;EACC;EACA;EACA;EACA;EACA;AAgCF;AA7BC;EACC;EACA;EACA;EACA;AA+BF;AA7BE;EAND;IAOE;EAgCD;AACF;AA9BE;EACC;EACA;EACA;EACA;EACA;EACA;AAgCH;AA7BE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AA+BH;ALzEC;EKiCC;IAYE;EAgCF;AACF;AA9BG;EACC;EACA;EACA;EACA;AAgCJ;AA7BG;EACC;AA+BJ;AA5BG;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AA8BJ;AA3BG;EACC;EACA;AA6BJ;AA1BG;EACC;EACA;AA4BJ;AAvBC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAyBF;AAtBC;EACC;EACA;AAwBF;AArBC;EACC;EACA;EACA;EACA;EACA;EACA;AAuBF;AArBE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAuBH;AApBE;EACC;AAsBH;AAnBE;EACC;AAqBH;AAlBE;;EAEC;AAoBH;AAjBE;EAjCD;IAkCE;IACA;EAoBD;EAlBC;IACC;EAoBF;EAjBC;IACC;EAmBF;EAhBC;IACC;EAkBF;AACF,C;;;;AC7MA;EACC;AACD;AACC;EACC;EACA;EACA;AACF;AAEC;EACC;EACA;AAAF,C;;;;ACXA,gBAAgB;ACAhB;AAGA;EACC;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;ADHD;;ACMA;AAeA;AAGA;EACC;ADnBD;;ACsBA;EACC;EACA;EACA;EACA;ADnBD;;ACqBA;EACC;EACA;EACA;EACA;EACA;ADlBD;;ACqBA;EACC;EACA;EACA;EACA;EACA;ADlBD;ACrBC;EAkCD;IAQE;IACA;EDjBA;AACF;ACxBC;EA+BD;IAaE;IACA;IACA;EDhBA;AACF;;ACoBC;EACC;ADjBF;;ACgBC;EACC;ADbF;;ACYC;EACC;ADTF;;ACQC;EACC;ADLF;;AClDC;EA6DC;IACC;EDPD;;ECMA;IACC;EDHD;;ECEA;IACC;EDCD;;ECFA;IACC;EDKD;;ECNA;IACC;EDSD;;ECVA;IACC;EDaD;;ECdA;IACC;EDiBD;;EClBA;IACC;EDqBD;AACF;ACjFC;EAkEC;IACC;EDkBD;;ECnBA;IACC;EDsBD;;ECvBA;IACC;ED0BD;;EC3BA;IACC;ED8BD;;EC/BA;IACC;EDkCD;;ECnCA;IACC;EDsCD;;ECvCA;IACC;ED0CD;;EC3CA;IACC;ED8CD;;EC/CA;IACC;EDkDD;;ECnDA;IACC;EDsDD;;ECvDA;IACC;ED0DD;;EC3DA;IACC;ED8DD;AACF;AC3HC;EAkEA;IACC;ED4DA;AACF;ACnIC;EA2EA;IACC;ED2DA;AACF;ACxDA;EACC;EACA;EACA;EACA;EACA;AD0DD;;ACvDA;EACC;EACA;EACA;EACA;EACA;AD0DD;AC9JC;EA+FD;IAQE;IACA;ED2DA;AACF;ACjKC;EA4FD;IAaE;IACA;IACA;ED4DA;AACF;;ACzDA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AD4DD;AC1DC;EACC;AD4DF;AC1DE;EACC;AD4DH;ACpDE;EACC;EACA;ADsDH;ACnDE;EACC;ADqDH;ACjDC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ADmDF;;AArOC;EACC;EACA;EACA;EACA;EACA;AAwOF;AArOC;EACC;AAuOF;AApOC;EACC;EACA;AAsOF;AAnOC;EACC;EACA;AAqOF;AAlOC;EACC;EACA;EACA;AAoOF;AAjOC;EACC;EACA;EACA;EACA;AAmOF;AAhOC;EACC;EACA;EACA;EACA;AAkOF;AA/NC;EACC;EACA;EACA;EACA;AAiOF;AA9NC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAgOF;AA7NC;EACC;EACA;EACA;AA+NF;AA7NE;EACC;AA+NH;AA3NC;EACC;EAEA;AA4NF;AA1NE;EACC;EACA;EACA;AA4NH;AAzNE;EACC;AA2NH;AAxNE;EACC;EACA;AA0NH,C;;;;AErTA,gBAAgB;ADAhB;AAGA;EACC;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;ACHD;;ADMA;AAeA;AAGA;EACC;ACnBD;;ADsBA;EACC;EACA;EACA;EACA;ACnBD;;ADqBA;EACC;EACA;EACA;EACA;EACA;AClBD;;ADqBA;EACC;EACA;EACA;EACA;EACA;AClBD;ADrBC;EAkCD;IAQE;IACA;ECjBA;AACF;ADxBC;EA+BD;IAaE;IACA;IACA;EChBA;AACF;;ADoBC;EACC;ACjBF;;ADgBC;EACC;ACbF;;ADYC;EACC;ACTF;;ADQC;EACC;ACLF;;ADlDC;EA6DC;IACC;ECPD;;EDMA;IACC;ECHD;;EDEA;IACC;ECCD;;EDFA;IACC;ECKD;;EDNA;IACC;ECSD;;EDVA;IACC;ECaD;;EDdA;IACC;ECiBD;;EDlBA;IACC;ECqBD;AACF;ADjFC;EAkEC;IACC;ECkBD;;EDnBA;IACC;ECsBD;;EDvBA;IACC;EC0BD;;ED3BA;IACC;EC8BD;;ED/BA;IACC;ECkCD;;EDnCA;IACC;ECsCD;;EDvCA;IACC;EC0CD;;ED3CA;IACC;EC8CD;;ED/CA;IACC;ECkDD;;EDnDA;IACC;ECsDD;;EDvDA;IACC;EC0DD;;ED3DA;IACC;EC8DD;AACF;AD3HC;EAkEA;IACC;EC4DA;AACF;ADnIC;EA2EA;IACC;EC2DA;AACF;ADxDA;EACC;EACA;EACA;EACA;EACA;AC0DD;;ADvDA;EACC;EACA;EACA;EACA;EACA;AC0DD;AD9JC;EA+FD;IAQE;IACA;EC2DA;AACF;ADjKC;EA4FD;IAaE;IACA;IACA;EC4DA;AACF;;ADzDA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AC4DD;AD1DC;EACC;AC4DF;AD1DE;EACC;AC4DH;ADpDE;EACC;EACA;ACsDH;ADnDE;EACC;ACqDH;ADjDC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ACmDF;;AArOC;EACC;EACA;EACA;EACA;AAwOF;AArOC;EACC;EACA;EACA;EACA;AAuOF;AApOC;EACC;AAsOF;AAnOC;EACC;EACA;EACA;EACA;EACA;EACA;AAqOF;AAnOE;EACC;EACA;AAqOH;AAlOE;EACC;EACA;AAoOH;AAhOC;EACC;EACA;EACA;AAkOF;AA9NE;EACC;AAgOH;AA7NE;EACC;AA+NH;AA3NC;EACC;AA6NF;AA1NC;EACC;EACA;EACA;EACA;EACA;AA4NF;AAzNC;EACC;EACA;AA2NF;AAxNC;EACC;EACA;AA0NF;AAvNC;EACC;AAyNF;AAtNC;EACC;AAwNF;AArNC;EACC;AAuNF;AApNC;EACC;AAsNF;AA/MG;EACC;EACA;AAiNJ;AA7ME;EACC;AA+MH;;AAzMA;EACC;IACC;EA4MA;EA1MA;IACC;EA4MD;;EAxMD;IACC;EA2MA;AACF,C","sources":["webpack://jetpack-connection-manager-ui/./_inc/components/header/style.scss","webpack://jetpack-connection-manager-ui/./_inc/components/admin/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/components/components/action-button/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/components/components/spinner/style.scss","webpack://jetpack-connection-manager-ui/../../../node_modules/.pnpm/@wordpress+base-styles@4.0.2/node_modules/@wordpress/base-styles/_breakpoints.scss","webpack://jetpack-connection-manager-ui/../../../node_modules/.pnpm/@wordpress+base-styles@4.0.2/node_modules/@wordpress/base-styles/_functions.scss","webpack://jetpack-connection-manager-ui/../../../node_modules/.pnpm/@wordpress+base-styles@4.0.2/node_modules/@wordpress/base-styles/_mixins.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/connect-screen/required-plan/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/connect-screen/layout/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/components/components/pricing-card/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/components/components/rna-styles.scss","webpack://jetpack-connection-manager-ui/../../js-packages/idc/components/idc-screen/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/idc/components/safe-mode/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/connection-status-card/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/rna-styles.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/disconnect-dialog/style.scss"],"sourcesContent":["#jetpack-connection-ui-container .jetpack-cui__header {\n\th1 {\n\t\ttext-align: left;\n\t\tfont-size: 4.6em;\n\t\tline-height: 1.2em;\n\t}\n}\n","#jetpack-connection-ui-container {\n\tmargin: 40px;\n\n\tp {\n\t\tfont-size: 1.23em;\n\t\tline-height: 1.5em;\n\t}\n}\n",".jp-action-button {\n\t&--button {\n\t\tbackground: #000;\n\t\tborder-radius: 4px;\n\t\tfont-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif;\n\t\tfont-style: normal;\n\t\tfont-weight: 600;\n\t\tfont-size: 14px;\n\t\tline-height: 18px;\n\t\ttext-align: center;\n\t\twidth: 264px;\n\t\theight: 40px;\n\t\tdisplay: block;\n\t}\n\t&__error{\n\t\tcolor: var( --jp-red ) !important;\n\t\tline-height: 25px !important;\n\t\tpadding-left: 25px;\n\t\tbackground: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDIwQzE2LjQxODMgMjAgMjAgMTYuNDE4MyAyMCAxMkMyMCA3LjU4MTcyIDE2LjQxODMgNCAxMiA0QzcuNTgxNzIgNCA0IDcuNTgxNzIgNCAxMkM0IDE2LjQxODMgNy41ODE3MiAyMCAxMiAyMFoiIHN0cm9rZT0iI0Q2MzYzOSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPHBhdGggZD0iTTEzIDdIMTFWMTNIMTNWN1oiIGZpbGw9IiNENjM2MzkiLz4KPHBhdGggZD0iTTEzIDE1SDExVjE3SDEzVjE1WiIgZmlsbD0iI0Q2MzYzOSIvPgo8L3N2Zz4K\") no-repeat 0 0;\n\t}\n}\n","@keyframes rotate-spinner {\n\t100% {\n\t\ttransform: rotate( 360deg );\n\t}\n}\n\n.jp-components-spinner {\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.jp-components-spinner__outer, .jp-components-spinner__inner {\n\tmargin: auto;\n\tbox-sizing: border-box;\n\tborder: 0.1em solid transparent;\n\tborder-radius: 50%;\n\tanimation: 3s linear infinite;\n\tanimation-name: rotate-spinner;\n}\n\n.jp-components-spinner__outer {\n\tborder-top-color: white;\n}\n\n.jp-components-spinner__inner {\n\twidth: 100%;\n\theight: 100%;\n\tborder-top-color: white;\n\tborder-right-color: white;\n\topacity: 0.4;\n}\n","/**\n * Breakpoints & Media Queries\n */\n\n// Most used breakpoints\n$break-huge: 1440px;\n$break-wide: 1280px;\n$break-xlarge: 1080px;\n$break-large: 960px;\t// admin sidebar auto folds\n$break-medium: 782px;\t// adminbar goes big\n$break-small: 600px;\n$break-mobile: 480px;\n$break-zoomed-in: 280px;\n\n// All media queries currently in WordPress:\n//\n// min-width: 2000px\n// min-width: 1680px\n// min-width: 1250px\n// max-width: 1120px *\n// max-width: 1000px\n// min-width: 769px and max-width: 1000px\n// max-width: 960px *\n// max-width: 900px\n// max-width: 850px\n// min-width: 800px and max-width: 1499px\n// max-width: 800px\n// max-width: 799px\n// max-width: 782px *\n// max-width: 768px\n// max-width: 640px *\n// max-width: 600px *\n// max-width: 520px\n// max-width: 500px\n// max-width: 480px *\n// max-width: 400px *\n// max-width: 380px\n// max-width: 320px *\n//\n// Those marked * seem to be more commonly used than the others.\n// Let's try and use as few of these as possible, and be mindful about adding new ones, so we don't make the situation worse\n","/**\n* Converts a hex value into the rgb equivalent.\n*\n* @param {string} hex - the hexadecimal value to convert\n* @return {string} comma separated rgb values\n*/\n@function hex-to-rgb($hex) {\n\t@return red($hex), green($hex), blue($hex);\n}\n","@import \"./functions\";\n\n/**\n * Breakpoint mixins\n */\n\n@mixin break-huge() {\n\t@media (min-width: #{ ($break-huge) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-wide() {\n\t@media (min-width: #{ ($break-wide) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-xlarge() {\n\t@media (min-width: #{ ($break-xlarge) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-large() {\n\t@media (min-width: #{ ($break-large) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-medium() {\n\t@media (min-width: #{ ($break-medium) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-small() {\n\t@media (min-width: #{ ($break-small) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-mobile() {\n\t@media (min-width: #{ ($break-mobile) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-zoomed-in() {\n\t@media (min-width: #{ ($break-zoomed-in) }) {\n\t\t@content;\n\t}\n}\n\n\n/**\n * Long content fade mixin\n *\n * Creates a fading overlay to signify that the content is longer\n * than the space allows.\n */\n\n@mixin long-content-fade($direction: right, $size: 20%, $color: #fff, $edge: 0, $z-index: false) {\n\tcontent: \"\";\n\tdisplay: block;\n\tposition: absolute;\n\t-webkit-touch-callout: none;\n\t-webkit-user-select: none;\n\t-khtml-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n\tpointer-events: none;\n\n\t@if $z-index {\n\t\tz-index: $z-index;\n\t}\n\n\t@if $direction == \"bottom\" {\n\t\tbackground: linear-gradient(to top, rgba($color, 0), $color 90%);\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\ttop: $edge;\n\t\tbottom: calc(100% - $size);\n\t\twidth: auto;\n\t}\n\n\t@if $direction == \"top\" {\n\t\tbackground: linear-gradient(to bottom, rgba($color, 0), $color 90%);\n\t\ttop: calc(100% - $size);\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\tbottom: $edge;\n\t\twidth: auto;\n\t}\n\n\t@if $direction == \"left\" {\n\t\tbackground: linear-gradient(to left, rgba($color, 0), $color 90%);\n\t\ttop: $edge;\n\t\tleft: $edge;\n\t\tbottom: $edge;\n\t\tright: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n\n\t@if $direction == \"right\" {\n\t\tbackground: linear-gradient(to right, rgba($color, 0), $color 90%);\n\t\ttop: $edge;\n\t\tbottom: $edge;\n\t\tright: $edge;\n\t\tleft: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n}\n\n/**\n * Focus styles.\n */\n\n@mixin block-toolbar-button-style__focus() {\n\tbox-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 4px $white;\n\n\t// Windows High Contrast mode will show this outline, but not the box-shadow.\n\toutline: 2px solid transparent;\n}\n\n// Tabs, Inputs, Square buttons.\n@mixin input-style__neutral() {\n\tbox-shadow: 0 0 0 transparent;\n\ttransition: box-shadow 0.1s linear;\n\tborder-radius: $radius-block-ui;\n\tborder: $border-width solid $gray-700;\n\t@include reduce-motion(\"transition\");\n}\n\n\n@mixin input-style__focus() {\n\tborder-color: var(--wp-admin-theme-color);\n\tbox-shadow: 0 0 0 ($border-width-focus - $border-width) var(--wp-admin-theme-color);\n\n\t// Windows High Contrast mode will show this outline, but not the box-shadow.\n\toutline: 2px solid transparent;\n}\n\n\n/**\n * Applies editor left position to the selector passed as argument\n */\n\n@mixin editor-left($selector) {\n\t#{$selector} { /* Set left position when auto-fold is not on the body element. */\n\t\tleft: 0;\n\n\t\t@media (min-width: #{ ($break-medium + 1) }) {\n\t\t\tleft: $admin-sidebar-width;\n\t\t}\n\t}\n\n\t.auto-fold #{$selector} { /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */\n\t\t@media (min-width: #{ ($break-medium + 1) }) {\n\t\t\tleft: $admin-sidebar-width-collapsed;\n\t\t}\n\n\t\t@media (min-width: #{ ($break-large + 1) }) {\n\t\t\tleft: $admin-sidebar-width;\n\t\t}\n\t}\n\n\t/* Sidebar manually collapsed. */\n\t.folded #{$selector} {\n\t\tleft: 0;\n\n\t\t@media (min-width: #{ ($break-medium + 1) }) {\n\t\t\tleft: $admin-sidebar-width-collapsed;\n\t\t}\n\t}\n\n\tbody.is-fullscreen-mode #{$selector} {\n\t\tleft: 0 !important;\n\t}\n}\n\n/**\n * Styles that are reused verbatim in a few places\n */\n\n// These are additional styles for all captions, when the theme opts in to block styles.\n@mixin caption-style() {\n\tmargin-top: 0.5em;\n\tmargin-bottom: 1em;\n}\n\n@mixin caption-style-theme() {\n\tcolor: #555;\n\tfont-size: $default-font-size;\n\ttext-align: center;\n\n\t.is-dark-theme & {\n\t\tcolor: $light-gray-placeholder;\n\t}\n}\n\n\n/**\n * Allows users to opt-out of animations via OS-level preferences.\n */\n\n@mixin reduce-motion($property: \"\") {\n\n\t@if $property == \"transition\" {\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition-duration: 0s;\n\t\t\ttransition-delay: 0s;\n\t\t}\n\t}\n\n\t@else if $property == \"animation\" {\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\tanimation-duration: 1ms;\n\t\t\tanimation-delay: 0s;\n\t\t}\n\t}\n\n\t@else {\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition-duration: 0s;\n\t\t\ttransition-delay: 0s;\n\t\t\tanimation-duration: 1ms;\n\t\t\tanimation-delay: 0s;\n\t\t}\n\t}\n\n}\n\n@mixin input-control {\n\tfont-family: $default-font;\n\tpadding: 6px 8px;\n\t@include input-style__neutral();\n\n\t/* Fonts smaller than 16px causes mobile safari to zoom. */\n\tfont-size: $mobile-text-min-font-size;\n\t/* Override core line-height. To be reviewed. */\n\tline-height: normal;\n\t@include break-small {\n\t\tfont-size: $default-font-size;\n\t\t/* Override core line-height. To be reviewed. */\n\t\tline-height: normal;\n\t}\n\n\t&:focus {\n\t\t@include input-style__focus();\n\t}\n\n\t// Use opacity to work in various editor styles.\n\t&::-webkit-input-placeholder {\n\t\tcolor: $dark-gray-placeholder;\n\t}\n\n\t&::-moz-placeholder {\n\t\topacity: 1; // Necessary because Firefox reduces this from 1.\n\t\tcolor: $dark-gray-placeholder;\n\t}\n\n\t&:-ms-input-placeholder {\n\t\tcolor: $dark-gray-placeholder;\n\t}\n}\n\n@mixin checkbox-control {\n\t@include input-control;\n\tborder: $border-width solid $gray-900;\n\tmargin-right: $grid-unit-15;\n\ttransition: none;\n\tborder-radius: $radius-block-ui;\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 ($border-width * 2) $white, 0 0 0 ($border-width * 2 + $border-width-focus) var(--wp-admin-theme-color);\n\n\t\t// Only visible in Windows High Contrast mode.\n\t\toutline: 2px solid transparent;\n\t}\n\n\t&:checked {\n\t\tbackground: var(--wp-admin-theme-color);\n\t\tborder-color: var(--wp-admin-theme-color);\n\n\t\t// Hide default checkbox styles in IE.\n\t\t&::-ms-check {\n\t\t\topacity: 0;\n\t\t}\n\t}\n\n\t&:checked::before,\n\t&[aria-checked=\"mixed\"]::before {\n\t\tmargin: -3px -5px;\n\t\tcolor: $white;\n\n\t\t@include break-medium() {\n\t\t\tmargin: -4px 0 0 -5px;\n\t\t}\n\t}\n\n\t&[aria-checked=\"mixed\"] {\n\t\tbackground: var(--wp-admin-theme-color);\n\t\tborder-color: var(--wp-admin-theme-color);\n\n\t\t&::before {\n\t\t\t// Inherited from `forms.css`.\n\t\t\t// See: https://github.com/WordPress/wordpress-develop/tree/5.1.1/src/wp-admin/css/forms.css#L122-L132\n\t\t\tcontent: \"\\f460\";\n\t\t\tfloat: left;\n\t\t\tdisplay: inline-block;\n\t\t\tvertical-align: middle;\n\t\t\twidth: 16px;\n\t\t\t/* stylelint-disable */\n\t\t\tfont: normal 30px/1 dashicons;\n\t\t\t/* stylelint-enable */\n\t\t\tspeak: none;\n\t\t\t-webkit-font-smoothing: antialiased;\n\t\t\t-moz-osx-font-smoothing: grayscale;\n\n\t\t\t@include break-medium() {\n\t\t\t\tfloat: none;\n\t\t\t\tfont-size: 21px;\n\t\t\t}\n\t\t}\n\t}\n}\n\n@mixin radio-control {\n\t@include input-control;\n\tborder: $border-width solid $gray-900;\n\tmargin-right: $grid-unit-15;\n\ttransition: none;\n\tborder-radius: $radius-round;\n\twidth: $radio-input-size-sm;\n\theight: $radio-input-size-sm;\n\n\t@include break-small() {\n\t\theight: $radio-input-size;\n\t\twidth: $radio-input-size;\n\t}\n\n\t&:checked::before {\n\t\tbox-sizing: inherit;\n\t\twidth: 8px;\n\t\theight: 8px;\n\t\ttransform: translate(7px, 7px);\n\t\tmargin: 0;\n\t\tbackground-color: $white;\n\n\t\t// This border serves as a background color in Windows High Contrast mode.\n\t\tborder: 4px solid $white;\n\n\t\t@include break-small() {\n\t\t\ttransform: translate(5px, 5px);\n\t\t}\n\t}\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 ($border-width * 2) $white, 0 0 0 ($border-width * 2 + $border-width-focus) var(--wp-admin-theme-color);\n\n\t\t// Only visible in Windows High Contrast mode.\n\t\toutline: 2px solid transparent;\n\t}\n\n\t&:checked {\n\t\tbackground: var(--wp-admin-theme-color);\n\t\tborder-color: var(--wp-admin-theme-color);\n\t}\n}\n\n/**\n * Reset default styles for JavaScript UI based pages.\n * This is a WP-admin agnostic reset\n */\n@mixin reset {\n\tbox-sizing: border-box;\n\n\t*,\n\t*::before,\n\t*::after {\n\t\tbox-sizing: inherit;\n\t}\n}\n\n/**\n * Reset the WP Admin page styles for Gutenberg-like pages.\n */\n@mixin wp-admin-reset( $content-container ) {\n\tbackground: $white;\n\n\t#wpcontent {\n\t\tpadding-left: 0;\n\t}\n\n\t#wpbody-content {\n\t\tpadding-bottom: 0;\n\t}\n\n\t/* We hide legacy notices in Gutenberg Based Pages, because they were not designed in a way that scaled well.\n\t Plugins can use Gutenberg notices if they need to pass on information to the user when they are editing. */\n\t#wpbody-content > div:not(#{ $content-container }):not(#screen-meta) {\n\t\tdisplay: none;\n\t}\n\n\t#wpfooter {\n\t\tdisplay: none;\n\t}\n\n\t.a11y-speak-region {\n\t\tleft: -1px;\n\t\ttop: -1px;\n\t}\n\n\tul#adminmenu a.wp-has-current-submenu::after,\n\tul#adminmenu > li.current > a.current::after {\n\t\tborder-right-color: $white;\n\t}\n\n\t.media-frame select.attachment-filters:last-of-type {\n\t\twidth: auto;\n\t\tmax-width: 100%;\n\t}\n}\n\n@mixin admin-scheme($color-primary) {\n\t// Define RGB equivalents for use in rgba function.\n\t// Hexadecimal css vars do not work in the rgba function.\n\t--wp-admin-theme-color: #{$color-primary};\n\t--wp-admin-theme-color--rgb: #{hex-to-rgb($color-primary)};\n\t// Darker shades.\n\t--wp-admin-theme-color-darker-10: #{darken($color-primary, 5%)};\n\t--wp-admin-theme-color-darker-10--rgb: #{hex-to-rgb(darken($color-primary, 5%))};\n\t--wp-admin-theme-color-darker-20: #{darken($color-primary, 10%)};\n\t--wp-admin-theme-color-darker-20--rgb: #{hex-to-rgb(darken($color-primary, 10%))};\n\n\t// Focus style width.\n\t// Avoid rounding issues by showing a whole 2px for 1x screens, and 1.5px on high resolution screens.\n\t--wp-admin-border-width-focus: 2px;\n\t@media ( -webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {\n\t\t--wp-admin-border-width-focus: 1.5px;\n\t}\n}\n\n@mixin wordpress-admin-schemes() {\n\tbody.admin-color-light {\n\t\t@include admin-scheme(#0085ba);\n\t}\n\n\tbody.admin-color-modern {\n\t\t@include admin-scheme(#3858e9);\n\t}\n\n\tbody.admin-color-blue {\n\t\t@include admin-scheme(#096484);\n\t}\n\n\tbody.admin-color-coffee {\n\t\t@include admin-scheme(#46403c);\n\t}\n\n\tbody.admin-color-ectoplasm {\n\t\t@include admin-scheme(#523f6d);\n\t}\n\n\tbody.admin-color-midnight {\n\t\t@include admin-scheme(#e14d43);\n\t}\n\n\tbody.admin-color-ocean {\n\t\t@include admin-scheme(#627c83);\n\t}\n\n\tbody.admin-color-sunrise {\n\t\t@include admin-scheme(#dd823b);\n\t}\n}\n\n// Deprecated from UI, kept for back-compat.\n@mixin background-colors-deprecated() {\n\t.has-very-light-gray-background-color {\n\t\tbackground-color: #eee;\n\t}\n\n\t.has-very-dark-gray-background-color {\n\t\tbackground-color: #313131;\n\t}\n}\n\n// Deprecated from UI, kept for back-compat.\n@mixin foreground-colors-deprecated() {\n\t.has-very-light-gray-color {\n\t\tcolor: #eee;\n\t}\n\n\t.has-very-dark-gray-color {\n\t\tcolor: #313131;\n\t}\n}\n\n// Deprecated from UI, kept for back-compat.\n@mixin gradient-colors-deprecated() {\n\t/*\n\t * Our classes uses the same values we set for gradient value attributes,\n\t * and we can not use spacing because of WP multi site kses rule.\n\t */\n\n\t/* stylelint-disable function-comma-space-after */\n\t.has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgba(0,208,132,1) 0%,rgba(6,147,227,1) 100%);\n\t}\n\n\t.has-purple-crush-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(52,226,228) 0%,rgb(71,33,251) 50%,rgb(171,29,254) 100%);\n\t}\n\n\t.has-hazy-dawn-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(250,172,168) 0%,rgb(218,208,236) 100%);\n\t}\n\n\t.has-subdued-olive-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(250,250,225) 0%,rgb(103,166,113) 100%);\n\t}\n\n\t.has-atomic-cream-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(253,215,154) 0%,rgb(0,74,89) 100%);\n\t}\n\n\t.has-nightshade-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(51,9,104) 0%,rgb(49,205,207) 100%);\n\t}\n\n\t.has-midnight-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);\n\t}\n\t/* stylelint-enable function-comma-space-after */\n}\n","@import '@wordpress/base-styles/breakpoints';\n@import '@wordpress/base-styles/mixins';\n\n.jp-connection__connect-screen-layout__left {\n\t@include break-xlarge {\n\t\twidth: 70%;\n\t}\n}\n\n.jp-connection__connect-screen-required-plan {\n\t@include break-xlarge {\n\t\tposition: relative;\n\t\tbackground: linear-gradient(to right, white 70%, #F9F9F6 30%);\n\t}\n\n\t&__loading {\n\t\tdisplay: none;\n\t}\n\n\t&__pricing-card {\n\n\t\t@include break-xlarge {\n\t\t\tposition: absolute;\n\t\t\ttop: 14%;\n\t\t\tleft: 62%;\n\t\t}\n\n\t\t.components-button {\n\t\t\twidth: 100%;\n\t\t\theight: auto;\n\t\t\tfont-size: 18px;\n\t\t\tfont-weight: 500;\n\t\t\tbackground: var( --jp-black ) !important;\n\t\t\tcolor: var( --jp-white ) !important;\n\t\t\tborder-radius: var( --jp-border-radius );\n\t\t\tpadding: 14px 24px;\n\t\t\tmargin: 24px 0px 32px;\n\t\t\tjustify-content: center;\n\t\t\talign-items: center;\n\t\t}\n\t}\n\n\t&__with-subscription {\n\t\tmargin-top: 38px;\n\n\t\t.jp-action-button {\n\t\t\tdisplay: inline;\n\t\t}\n\n\t\t.jp-action-button--button {\n\t\t\tdisplay: inline;\n\t\t\tfont-size: var( --font-title-small );\n\t\t\tline-height: 20px;\n\t\t\tcolor: var( --jp-black ) !important;\n\t\t\tbackground: inherit !important;\n\t\t\ttext-decoration: underline;\n\n\t\t\twidth: auto;\n\t\t\theight: auto;\n\t\t\tfont: inherit;\n\t\t\tpadding: 0;\n\n\t\t\t&:hover {\n\t\t\tbackground: inherit;\n\t\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t\t}\n\n\t\t\t&:focus {\n\t\t\t\tbackground: inherit;\n\t\t\t\tbox-shadow: none !important;\n\t\t\t}\n\t\t}\n\n\t\t.jp-components-spinner__inner, .jp-components-spinner__outer {\n\t\t\tborder-top-color: var( --jp-black ); \n\t\t\tborder-right-color: var( --jp-black ); \n\t\t}\n\t}\n}\n","@import '@wordpress/base-styles/breakpoints';\n@import '@wordpress/base-styles/mixins';\n\n.jp-connection__connect-screen-layout {\n\tbackground: var( --jp-white );\n\tbox-shadow: 0 0 40px rgba(0, 0, 0, 0.08);\n\tborder-radius: 4px;\n\n\t&__loading {\n\t\tdisplay: none;\n\t}\n\n\t&__left, &__right {\n\t\tbox-sizing: border-box;\n\t}\n\n\t&__left {\n\t\tpadding: 25px;\n\n\t\t@include break-small {\n\t\t\tpadding: 64px 96px;\n\t\t}\n\n\t\t.jetpack-logo {\n\t\t\tmargin-bottom: 24px;\n\t\t}\n\n\t\th2 {\n\t\t\tfont-style: normal;\n\t\t\tfont-weight: bold;\n\t\t\tfont-size: 36px;\n\t\t\tline-height: 40px;\n\t\t\tcolor: var( --jp-black );\n\t\t\tmargin-top: 32px;\n\t\t\tmargin-bottom: 0;\n\t\t}\n\n\t\th3 {\n\t\t\tfont-style: normal;\n\t\t\tfont-weight: 500;\n\t\t\tfont-size: 24px;\n\t\t\tline-height: 32px;\n\t\t\tcolor: var( --jp-black );\n\t\t\tmargin-top: 32px;\n\t\t\tmargin-bottom: 0;\n\t\t}\n\n\t\tp, li {\n\t\t\tfont-style: normal;\n\t\t\tfont-weight: normal;\n\t\t\tfont-size: 16px;\n\t\t\tline-height: 24px;\n\t\t}\n\n\t\tp {\n\t\t\tcolor: #101517;\n\t\t\tmargin: 16px 0;\n\t\t}\n\n\t\ta {\n\t\t\tfont-size: var( --font-body );\n\t\t\tcolor: var( --jp-black );\n\t\t\ttext-decoration: underline;\n\t\t\theight: auto;\n\t\t\tfont: inherit;\n\t\t\tpadding: 0;\n\n\t\t\t&:hover {\n\t\t\t\tcolor: var( --jp-black );\n\t\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t\t}\n\n\t\t\t&:focus {\n\t\t\t\tcolor: var( --jp-black );\n\t\t\t\tbox-shadow: none !important;\n\t\t\t}\n\t\t}\n\n\t\tul {\n\t\t\tlist-style-type: none;\n\t\t\tpadding: 0;\n\n\t\t\tli {\n\t\t\t\tbackground: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAANlBMVEVHcEwFnwUInggGnggGnggHnAcAnwUFnQcAnwcGnwkFnQgGnQgFnwcGnQYFnQcFnAcGnQkDnwdhiL0pAAAAEnRSTlMAMF//f2Aw7yBQ3+9gcIBgcED+HDbkAAAAZklEQVR4Ae3LNwICARDDQC0+cv7/Y8mwV9odSfWIcf/+VegnGkIvDaGXKvTTn/Gz+Uf5xTL0K1XotS7fs5H6GHvvaO8d7c3j7rdgHne/A/PYt/cO+R42oYdN6OEQetiFHo4A//6dAXqtBEkmtWutAAAAAElFTkSuQmCC) no-repeat;\n\t\t\t\tbackground-size: 24px;\n\t\t\t\tpadding-left: 30px;\n\t\t\t\tmargin-bottom: 9px;\n\t\t\t\tcolor: var( --jp-black );\n\t\t\t}\n\t\t}\n\t}\n\n\t&__right {\n\t\tpadding: 64px 0;\n\n\t\timg {\n\t\t\tmax-width: 100%;\n\t\t}\n\t}\n\n\t&__two-columns {\n\t\t.jp-connection__connect-screen-layout__left {\n\t\t\tfloat: left;\n\t\t\twidth: 100%;\n\n\t\t\t@include break-xlarge {\n\t\t\t\twidth: 52%;\n\t\t\t}\n\t\t}\n\n\t\t.jp-connection__connect-screen-layout__right {\n\t\t\tfloat: right;\n\t\t\twidth: 47%;\n\t\t\tbackground: #F9F9F6;\n\t\t\tdisplay: none;\n\n\t\t\t@include break-xlarge {\n\t\t\t\tdisplay: block;\n\t\t\t}\n\t\t}\n\t}\n\n\t&__clearfix {\n\t\tclear: both;\n\t}\n}\n","@import '../rna-styles';\n\n.jp-components__pricing-card {\n\twidth: -moz-fit-content;\n\twidth: fit-content;\n\tmax-width: 384px;\n\tpadding: 24px 24px 32px;\n\tbackground:var( --jp-white );\n\tbox-shadow: 0px 10px 40px rgba( 0, 0, 0, 0.08 );\n\tborder-radius: var( --jp-border-radius );\n\n\t@media screen and ( min-width: 600px ) {\n\t\tpadding: 32px 32px 44px;\n\t}\n\n\t&__icon {\n\t\timg {\n\t\t\theight: 32px;\n\t\t\twidth: 32px;\n\t\t}\n\t}\n\n\t&__title {\n\t\tmargin: 16px 0 24px;\n\t\tcolor: #101517;\n\t\tfont-size: 32px;\n\t\tline-height: 38px;\n\t}\n\n\t&__pricing {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t}\n\n\t&__price-before,\n\t&__price-after {\n\t\tdisplay: inline-block;\n\t\tmargin-bottom: 8px;\n\t\tpadding: 0 2px;\n\t\tfont-size: 54px;\n\t\tfont-weight: 700;\n\t\tline-height: 40px;\n\t}\n\n\t&__price-before {\n\t\tposition: relative;\n\t\tmargin-right: 16px;\n\t\tcolor: var( --jp-gray-20 );\n\t}\n\n\t&__price-strikethrough {\n\t\tposition: absolute;\n\t\twidth: 100%;\n\t\theight: 3px;\n\t\tleft: 0px;\n\t\ttop: 20px;\n\t\tbackground: var( --jp-pink );\n\t\tborder-radius: 1.5px;\n\t}\n\n\t&__price-after {\n\t\tcolor: var( --jp-black );\n\t}\n\n\t&__currency {\n\t\tvertical-align: super;\n\t\tfont-size: var( --font-title-small );\n\t\tfont-weight: 400;\n\t\tline-height: 20px;\n\t}\n\n\t&__price-details {\n\t\talign-self: flex-end;\n\t\tmargin-bottom: 8px;\n\t\tfont-size: 14px;\n\t\tfont-weight: 400;\n\t\tline-height: 17px;\n\t\tcolor: var( --jp-gray-50 );\n\t\tletter-spacing: -0.02em;\n\t}\n\n\t&__price-decimal {\n\t\tfont-size: var( --font-label );\n\t\tline-height: 14px;\n\t\tvertical-align: top;\n\t}\n\n\t&__button {\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tfont-size: 18px;\n\t\tbackground: var( --jp-black );\n\t\tcolor: var( --jp-white ) !important;\n\t\tborder-radius: var( --jp-border-radius );\n\t\tpadding: 14px 24px;\n\t\tmargin: 24px 0px 32px;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t&__info {\n\t\tfont-size: var( --font-label );\n\t\tline-height: 20px;\n\t\tletter-spacing: -0.02em;\n\t\tcolor: var( --jp-gray-60 );\n\t}\n}\n","/********* RNA styles *********/\n// We should extract this into a package\n\n:root {\n\t--font-title-large: 36px;\n\t--font-title-small: 24px;\n\t--font-body: 16px;\n\t--font-label: 12px;\n\t\n\t--jp-black: #000000;\n\t--jp-black-80: #2C3338;\n\t--jp-white: #FFFFFF;\n\t--jp-white-off: #F9F9F6;\n\t--jp-gray: #DCDCDE;\n\t--jp-gray-20: #A7AAAD;\n\t--jp-gray-40: #787C82;\n\t--jp-gray-50: #646970;\n\t--jp-gray-60: #50575E;\n\t--jp-gray-off: #E2E2DF;\n\t--jp-red: #D63639;\n\t--jp-pink: #C9356E;\n\n\t--jp-green-primary: #069E08;\n\t--jp-green-secondary: #2FB41F;\n\n\t--jp-border-radius: 4px;\n\t--jp-menu-border-height: 1px;\n\t--jp-underline-thickness: 2px;\n}\n\n/********* Mixins *********/\n@mixin for-phone-up {\n\t@media (min-width: 600px) { @content; }\n}\n@mixin for-tablet-up {\n\t@media (min-width: 960px) { @content; }\n}\n\n@mixin for-phone-down {\n\t@media (max-width: 600px) { @content; }\n}\n@mixin for-tablet-down {\n\t@media (max-width: 960px) { @content; }\n}\n\n/********* Generic styles *********/\n$wp-gray-dark: #23282D;\n\n* {\n\tbox-sizing: border-box;\n}\n\nbody {\n\tmin-height: 100%;\n\tmargin: 0;\n\tpadding: 0;\n\tfont-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen-Sans\", \"Ubuntu\", \"Cantarell\", \"Helvetica Neue\", sans-serif;\n}\n.jp-wrap {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-wrap: wrap;\n\tmax-width: 1128px;\n\tmargin: 0 auto;\n}\n\n.jp-row {\n\tdisplay: grid;\n\tgrid-gap: 24px;\n\tgrid-template-columns: repeat(4, 1fr);\n\twidth: 100%;\n\tmargin: 0 16px;\n\t\n\t@include for-phone-up {\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tmargin: 0 18px;\n\t}\n\t\n\t@include for-tablet-up {\n\t\tgrid-template-columns: repeat(12, 1fr);\n\t\tmax-width: 1128px;\n\t\tmargin: 0 24px;\n\t}\n}\n\n@for $i from 1 through 4 {\n\t.sm-col-span-#{$i} {\n\t\tgrid-column-end: span #{$i};\n\t}\n}\n\n@include for-phone-up {\n\t@for $i from 1 through 8 {\n\t\t.md-col-span-#{$i} {\n\t\t\tgrid-column-end: span #{$i};\n\t\t}\n\t}\n}\n\n@include for-tablet-up {\n\t@for $i from 1 through 12 {\n\t\t.lg-col-span-#{$i} {\n\t\t\tgrid-column-end: span #{$i};\n\t\t}\n\t}\n}\n\n@include for-tablet-down {\n\t.md-col-span-0 {\n\t\tdisplay: none;\n\t}\n}\n\n@include for-phone-down {\n\t.sm-col-span-0 {\n\t\tdisplay: none;\n\t}\n}\n\n.jp-wrap {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-wrap: wrap;\n\tmax-width: 1128px;\n\tmargin: 0 auto;\n}\n\n.jp-row {\n\tdisplay: grid;\n\tgrid-gap: 24px;\n\tgrid-template-columns: repeat(4, 1fr);\n\twidth: 100%;\n\tmargin: 0 16px;\n\t\n\t@include for-phone-up {\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tmargin: 0 18px;\n\t}\n\t\n\t@include for-tablet-up {\n\t\tgrid-template-columns: repeat(12, 1fr);\n\t\tmax-width: 1128px;\n\t\tmargin: 0 24px;\n\t}\n}\n\n.jp-cut {\n\tposition: relative;\n\tdisplay: block;\n\tmargin: 32px 0;\n\tpadding: 16px 64px 16px 24px;\n\tborder: 2px solid var( --jp-green-primary );\n\tborder-radius: var( --jp-border-radius );\n\ttext-decoration: none;\n\n\tspan {\n\t\tdisplay: block;\n\n\t\t&:last-of-type {\n\t\t\tfont-weight: 600;\n\t\t}\n\t}\n\n\t&:hover,\n\t&:focus {\n\t\t//box-shadow: 0px 0px 40px rgba( 0, 0, 0, 0.08 );\n\n\t\tspan:last-of-type {\n\t\t\ttext-decoration: underline;\n\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t}\n\n\t\t&:after {\n\t\t\ttransform: translateY( -50% ) translateX( 8px );\n\t\t}\n\t}\n\n\t&:after {\n\t\tcontent: \"→\";\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\tright: 24px;\n\t\tfont-size: 24px;\n\t\tfont-weight: 600;\n\t\tcolor: var( --jp-green-primary );\n\t\ttransform: translateY( -50% );\n\t\ttransition: transform 0.15s ease-out;\n\t}\n}\n","@import '@wordpress/base-styles/breakpoints';\n@import '@wordpress/base-styles/mixins';\n\n.jp-idc-screen-base {\n\tfont-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif;\n\tbackground: white;\n\tpadding: 10px;\n\tbox-shadow: 0 0 40px rgba(0, 0, 0, 0.04);\n\tborder-radius: 4px;\n\tborder-left: 4px solid #E68B28;\n\tmax-width: 1128px;\n\tbox-sizing: border-box;\n\tmargin: 0 auto;\n\n\t@include break-small {\n\t\tpadding: 48px;\n\t}\n\n\t.jp-idc-header {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\n\t\t.jp-idc-logo-label {\n\t\t\tfont-size: 14px;\n\t\t\tline-height: 22px;\n\t\t\tmargin: -7px 0 0 8px;\n\t\t}\n\t}\n\n\th2 {\n\t\tmargin: 32px 0 16px;\n\t\tfont-weight: 600;\n\t\tfont-size: 24px;\n\t\tline-height: 28px;\n\t}\n\n\th3 {\n\t\tmargin: 24px 0 0;\n\t\tfont-weight: 600;\n\t\tfont-size: 20px;\n\t\tline-height: 28px;\n\t}\n\n\tp {\n\t\tmargin: 0;\n\t\tmax-width: 710px;\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tcolor: #2C3338;\n\t}\n\n\t.jp-idc-cards {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tflex-direction: column;\n\t\talign-items: center;\n\n\t\t@media only screen and (min-width: 1400px) {\n\t\t\tflex-direction: row;\n\t\t}\n\n\t\t.jp-idc-cards-separator {\n\t\t\tfont-weight: 600;\n\t\t\tfont-size: 20px;\n\t\t\tline-height: 28px;\n\t\t\tcolor: #23282D;\n\t\t\tmargin: 0 24px;\n\t\t\talign-self: center;\n\t\t}\n\n\t\t.jp-idc-card-action-base {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\tjustify-content: space-between;\n\t\t\tmax-width: 100%;\n\t\t\twidth: 480px;\n\t\t\tborder: 1px solid #C3C4C7;\n\t\t\tborder-radius: 4px;\n\t\t\tpadding: 10px;\n\t\t\tmargin: 24px 0;\n\n\t\t\t@include break-small {\n\t\t\t\tpadding: 24px;\n\t\t\t}\n\n\t\t\th4 {\n\t\t\t\tmargin: 0 0 8px;\n\t\t\t\tfont-weight: normal;\n\t\t\t\tfont-size: 20px;\n\t\t\t\tline-height: 28px;\n\t\t\t}\n\n\t\t\tp {\n\t\t\t\tmargin: 0 0 24px;\n\t\t\t}\n\n\t\t\t.jp-idc-card-action-sitename {\n\t\t\t\twidth: 100%;\n\t\t\t\tbackground: #F9F9F6;\n\t\t\t\tborder-radius: 33px;\n\t\t\t\tfont-weight: bold;\n\t\t\t\tfont-size: 16px;\n\t\t\t\tline-height: 24px;\n\t\t\t\tcolor: #2C3338;\n\t\t\t\ttext-align: center;\n\t\t\t\tpadding: 16px;\n\t\t\t\toverflow-wrap: anywhere;\n\t\t\t}\n\n\t\t\t.jp-idc-card-action-separator {\n\t\t\t\tmargin: 12px auto;\n\t\t\t\tdisplay: block;\n\t\t\t}\n\n\t\t\t.jp-idc-card-action-button {\n\t\t\t\twidth: 100%;\n\t\t\t\tpadding: 8px 24px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.jp-idc-card-action-button {\n\t\tmargin-top: 24px;\n\t\tpadding: 8px;\n\t\theight: auto;\n\t\tmin-height: 40px;\n\t\tbackground: #000000;\n\t\tborder-radius: 4px;\n\t\tfont-weight: 600;\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tcolor: #FFFFFF;\n\t\tjustify-content: center;\n\t}\n\n\t.jp-idc-card-action-button-migrated {\n\t\twidth: 141px;\n\t\tmargin-top: 64px;\n\t}\n\n\t.jp-idc-card-migrated {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tflex-direction: column;\n\t\talign-items: center;\n\t\twidth: 100%;\n\t\tmargin-top: 24px;\n\n\t\t.jp-idc-card-migrated-hostname {\n\t\t\tborder: 1px solid #C3C4C7;\n\t\t\tborder-radius: 4px;\n\t\t\tpadding: 24px;\n\t\t\tfont-weight: bold;\n\t\t\tfont-size: 16px;\n\t\t\tline-height: 24px;\n\t\t\tcolor: #2C3338;\n\t\t\tflex-grow: 1;\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.jp-idc-card-migrated-separator-wide {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\t.jp-idc-card-migrated-separator {\n\t\t\tdisplay: block;\n\t\t}\n\n\t\t.jp-idc-card-migrated-separator,\n\t\t.jp-idc-card-migrated-separator-wide {\n\t\t\tmargin: 28px;\n\t\t}\n\n\t\t@media only screen and (min-width: 1400px) {\n\t\t\tflex-direction: row;\n\t\t\twidth: auto;\n\n\t\t\t.jp-idc-card-migrated-separator {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\n\t\t\t.jp-idc-card-migrated-separator-wide {\n\t\t\t\tdisplay: block;\n\t\t\t}\n\n\t\t\t.jp-idc-card-migrated-hostname {\n\t\t\t\twidth: auto;\n\t\t\t}\n\t\t}\n\t}\n}\n",".jp-idc-screen-base .jp-idc-safe-mode {\n\ttext-align: center;\n\n\t&, button {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tcolor: #2C3338;\n\t}\n\n\tbutton {\n\t\tpadding: 0;\n\t\ttext-decoration: underline;\n\t}\n}\n","@import '../rna-styles';\n\n.jp-connection-status-card {\n\th3 {\n\t\tfont-size: 36px;\n\t\tline-height: 40px;\n\t\tfont-weight: 400;\n\t\tcolor: var( --jp-black );\n\t\tmargin: 0;\n\t}\n\n\ta, a:active, a:hover {\n\t\tcolor: var( --jp-black );\n\t}\n\n\tp {\n\t\tmargin: 16px 0;\n\t\tcolor: var( --jp-black );\n\t}\n\n\tp, a, li {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t}\n\n\t&--status {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tmargin: 24px 0 24px -6px;\n\t}\n\n\t&--cloud {\n\t\tbackground-image: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDIiIGhlaWdodD0iNDIiIHZpZXdCb3g9IjAgMCA0MiA0MiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPG1hc2sgaWQ9Im1hc2swIiBtYXNrLXR5cGU9ImFscGhhIiBtYXNrVW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4PSI3IiB5PSI5IiB3aWR0aD0iMjgiIGhlaWdodD0iMjEiPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTMwLjMzMjkgMTcuNjk2N0MzMC4zMzMxIDE3LjY3MDMgMzAuMzMzMyAxNy42NDM3IDMwLjMzMzMgMTcuNjE2OUMzMC4zMzMzIDEzLjM2NDQgMjYuNTcyNSA5LjkxNjk5IDIxLjkzMzMgOS45MTY5OUMxOC4wMTcxIDkuOTE2OTkgMTQuNzI3IDEyLjM3MzUgMTMuNzk2NSAxNS42OTczQzEzLjcwOTIgMTUuNjkzNyAxMy42MjE1IDE1LjY5MTkgMTMuNTMzMyAxNS42OTE5QzkuOTI1MDcgMTUuNjkxOSA3IDE4LjcwODQgNyAyMi40Mjk0QzcgMjYuMTUwNCA5LjkyNTA3IDI5LjE2NjkgMTMuNTMzMyAyOS4xNjY5TDEzLjU3MjIgMjkuMTY2N0gyOS4zNjgzQzI5LjM3ODYgMjkuMTY2OSAyOS4zODkgMjkuMTY2OSAyOS4zOTkzIDI5LjE2NjlDMzIuNDkyMSAyOS4xNjY5IDM0Ljk5OTMgMjYuNTgxMyAzNC45OTkzIDIzLjM5MTlDMzQuOTk5MyAyMC41MzA1IDMyLjk4MTQgMTguMTU1IDMwLjMzMjkgMTcuNjk2N1oiIGZpbGw9IndoaXRlIi8+CjwvbWFzaz4KPGcgbWFzaz0idXJsKCNtYXNrMCkiPgo8cGF0aCBkPSJNMzAuMzMyOSAxNy42OTY3TDI3LjcwODEgMTcuNjY3N0wyNy42ODM0IDE5LjkwMjJMMjkuODg1MyAyMC4yODM0TDMwLjMzMjkgMTcuNjk2N1pNMTMuNzk2NSAxNS42OTczTDEzLjY4OTMgMTguMzIwMUwxNS43NjQ0IDE4LjQwNDlMMTYuMzI0MyAxNi40MDQ5TDEzLjc5NjUgMTUuNjk3M1pNMTMuNTMzMyAyOS4xNjY5VjMxLjc5MTlIMTMuNTQxMkwxMy41MzMzIDI5LjE2NjlaTTEzLjU3MjIgMjkuMTY2N1YyNi41NDE3SDEzLjU2NDNMMTMuNTcyMiAyOS4xNjY3Wk0yOS4zNjgzIDI5LjE2NjdMMjkuMzgzMiAyNi41NDE3SDI5LjM2ODNWMjkuMTY2N1pNMzIuOTU3OCAxNy43MjU4QzMyLjk1ODEgMTcuNjg5NyAzMi45NTgzIDE3LjY1MzMgMzIuOTU4MyAxNy42MTY5SDI3LjcwODNDMjcuNzA4MyAxNy42MzM5IDI3LjcwODMgMTcuNjUwOSAyNy43MDgxIDE3LjY2NzdMMzIuOTU3OCAxNy43MjU4Wk0zMi45NTgzIDE3LjYxNjlDMzIuOTU4MyAxMS43MDQzIDI3LjgwMjYgNy4yOTE5OSAyMS45MzMzIDcuMjkxOTlWMTIuNTQyQzI1LjM0MjUgMTIuNTQyIDI3LjcwODMgMTUuMDI0NSAyNy43MDgzIDE3LjYxNjlIMzIuOTU4M1pNMjEuOTMzMyA3LjI5MTk5QzE2Ljk0ODcgNy4yOTE5OSAxMi41NDQ5IDEwLjQzMDkgMTEuMjY4NyAxNC45ODk2TDE2LjMyNDMgMTYuNDA0OUMxNi45MDkxIDE0LjMxNjIgMTkuMDg1NyAxMi41NDIgMjEuOTMzMyAxMi41NDJWNy4yOTE5OVpNMTMuOTAzNiAxMy4wNzQ0QzEzLjc4MDcgMTMuMDY5NCAxMy42NTcyIDEzLjA2NjkgMTMuNTMzMyAxMy4wNjY5VjE4LjMxNjlDMTMuNTg1NyAxOC4zMTY5IDEzLjYzNzggMTguMzE4IDEzLjY4OTMgMTguMzIwMUwxMy45MDM2IDEzLjA3NDRaTTEzLjUzMzMgMTMuMDY2OUM4LjM5OTc3IDEzLjA2NjkgNC4zNzUgMTcuMzM1NCA0LjM3NSAyMi40Mjk0SDkuNjI1QzkuNjI1IDIwLjA4MTQgMTEuNDUwNCAxOC4zMTY5IDEzLjUzMzMgMTguMzE2OVYxMy4wNjY5Wk00LjM3NSAyMi40Mjk0QzQuMzc1IDI3LjUyMzUgOC4zOTk3NyAzMS43OTE5IDEzLjUzMzMgMzEuNzkxOVYyNi41NDE5QzExLjQ1MDQgMjYuNTQxOSA5LjYyNSAyNC43Nzc0IDkuNjI1IDIyLjQyOTRINC4zNzVaTTEzLjU0MTIgMzEuNzkxOUwxMy41ODAxIDMxLjc5MTdMMTMuNTY0MyAyNi41NDE3TDEzLjUyNTUgMjYuNTQxOUwxMy41NDEyIDMxLjc5MTlaTTEzLjU3MjIgMzEuNzkxN0gyOS4zNjgzVjI2LjU0MTdIMTMuNTcyMlYzMS43OTE3Wk0yOS4zOTkzIDI2LjU0MTlDMjkuMzkzNyAyNi41NDE5IDI5LjM4ODQgMjYuNTQxOSAyOS4zODMyIDI2LjU0MTlMMjkuMzUzNCAzMS43OTE3QzI5LjM2ODggMzEuNzkxOSAyOS4zODQzIDMxLjc5MTkgMjkuMzk5MyAzMS43OTE5VjI2LjU0MTlaTTMyLjM3NDMgMjMuMzkxOUMzMi4zNzQzIDI1LjIwODIgMzAuOTY2OCAyNi41NDE5IDI5LjM5OTMgMjYuNTQxOVYzMS43OTE5QzM0LjAxNzQgMzEuNzkxOSAzNy42MjQzIDI3Ljk1NDMgMzcuNjI0MyAyMy4zOTE5SDMyLjM3NDNaTTI5Ljg4NTMgMjAuMjgzNEMzMS4yMzk2IDIwLjUxNzcgMzIuMzc0MyAyMS43NzA5IDMyLjM3NDMgMjMuMzkxOUgzNy42MjQzQzM3LjYyNDMgMTkuMjkwMSAzNC43MjMxIDE1Ljc5MjUgMzAuNzgwNiAxNS4xMTAyTDI5Ljg4NTMgMjAuMjgzNFoiIGZpbGw9IiMxRTFFMUUiLz4KPC9nPgo8L3N2Zz4K\");\n\t\twidth: 42px;\n\t\theight: 42px;\n\t\tmargin-right: 4px;\n\t}\n\n\t&--jetpack-logo {\n\t\tbackground-image: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE2IDMyQzI0LjgzNjYgMzIgMzIgMjQuODM2NiAzMiAxNkMzMiA3LjE2MzQ0IDI0LjgzNjYgMCAxNiAwQzcuMTYzNDQgMCAwIDcuMTYzNDQgMCAxNkMwIDI0LjgzNjYgNy4xNjM0NCAzMiAxNiAzMloiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0xNi43OTM5IDEzLjMxMjVWMjguODI0TDI0Ljc5MzkgMTMuMzEyNUgxNi43OTM5WiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZD0iTTE1LjE3NTUgMTguNjU2N1YzLjE3NTc4TDcuMjA2MDUgMTguNjU2N0gxNS4xNzU1WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==\");\n\t\twidth: 32px;\n\t\theight: 32px;\n\t\tmargin-left: 11px;\n\t}\n\n\t&--btn-connect-user {\n\t\theight: 40px;\n\t\tfont-size: var( --font-body-small );\n\t\tborder-radius: 4px;\n\t\tbackground: var( --jp-black ) !important;\n\t}\n\n\t&--avatar {\n\t\tborder: 0;\n\t\tborder-radius: 20px;\n\t\twidth: 32px;\n\t\theight: 32px;\n\t\tbackground-color: var( --jp-white );\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-size: contain;\n\t\tmargin-left: -10px;\n\t\tbackground-image: url(\"data:image/svg+xml,%3Csvg width='32' height='32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='16' cy='16' r='16' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.498 27.123C6.038 24.165 10.916 21.5 16 21.5c5.084 0 9.963 2.665 11.502 5.623a15.952 15.952 0 01-11.257 4.875L16 32l-.245-.002a15.952 15.952 0 01-11.257-4.875zM16 8a6 6 0 110 12 6 6 0 010-12z' fill='%23A2AAB2'/%3E%3C/svg%3E%0A\");\n\t}\n\n\t&--line {\n\t\twidth: 67px;\n\t\theight: 0;\n\t\tborder-top: 2px solid var( --jp-black );\n\n\t\t&.jp-connection-status-card--site-only {\n\t\t\tborder-top-style: dashed;\n\t\t}\n\t}\n\n\t&--list {\n\t\tmargin: 16px 0;\n\n\t\tlist-style-type: none;\n\n\t\tli {\n\t\t\tpadding-left: 25px;\n\t\t\tcolor: var( --jp-black );\n\t\t\tmargin: 0 0 8px -3px;\n\t\t}\n\n\t\t&-item-success {\n\t\t\tbackground: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE4LjkzNDggNi4wMDAwM0wxMC4wMzQyIDE3Ljk3MDNMNC44NzMxIDE0LjEzMjgiIHN0cm9rZT0iIzFFMUUxRSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPC9zdmc+Cg==\") no-repeat 0 0;\n\t\t}\n\n\t\t&-item-error {\n\t\t\tcolor: var( --jp-red ) !important;\n\t\t\tbackground: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDIwQzE2LjQxODMgMjAgMjAgMTYuNDE4MyAyMCAxMkMyMCA3LjU4MTcyIDE2LjQxODMgNCAxMiA0QzcuNTgxNzIgNCA0IDcuNTgxNzIgNCAxMkM0IDE2LjQxODMgNy41ODE3MiAyMCAxMiAyMFoiIHN0cm9rZT0iI0Q2MzYzOSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPHBhdGggZD0iTTEzIDdIMTFWMTNIMTNWN1oiIGZpbGw9IiNENjM2MzkiLz4KPHBhdGggZD0iTTEzIDE1SDExVjE3SDEzVjE1WiIgZmlsbD0iI0Q2MzYzOSIvPgo8L3N2Zz4K\") no-repeat 0 0;\n\t\t}\n\t}\n}\n","/********* RNA styles *********/\n// We should extract this into a package\n\n:root {\n\t--font-title-large: 36px;\n\t--font-title-small: 24px;\n\t--font-body: 16px;\n\t--font-label: 12px;\n\t\n\t--jp-black: #000000;\n\t--jp-black-80: #2C3338;\n\t--jp-white: #FFFFFF;\n\t--jp-white-off: #F9F9F6;\n\t--jp-gray: #DCDCDE;\n\t--jp-gray-off: #E2E2DF;\n\t--jp-red: #D63639;\n\n\t--jp-green-primary: #069E08;\n\t--jp-green-secondary: #2FB41F;\n\n\t--jp-border-radius: 4px;\n\t--jp-menu-border-height: 1px;\n\t--jp-underline-thickness: 2px;\n}\n\n/********* Mixins *********/\n@mixin for-phone-up {\n\t@media (min-width: 600px) { @content; }\n}\n@mixin for-tablet-up {\n\t@media (min-width: 960px) { @content; }\n}\n\n@mixin for-phone-down {\n\t@media (max-width: 600px) { @content; }\n}\n@mixin for-tablet-down {\n\t@media (max-width: 960px) { @content; }\n}\n\n/********* Generic styles *********/\n$wp-gray-dark: #23282D;\n\n* {\n\tbox-sizing: border-box;\n}\n\nbody {\n\tmin-height: 100%;\n\tmargin: 0;\n\tpadding: 0;\n\tfont-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen-Sans\", \"Ubuntu\", \"Cantarell\", \"Helvetica Neue\", sans-serif;\n}\n.jp-wrap {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-wrap: wrap;\n\tmax-width: 1128px;\n\tmargin: 0 auto;\n}\n\n.jp-row {\n\tdisplay: grid;\n\tgrid-gap: 24px;\n\tgrid-template-columns: repeat(4, 1fr);\n\twidth: 100%;\n\tmargin: 0 16px;\n\t\n\t@include for-phone-up {\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tmargin: 0 18px;\n\t}\n\t\n\t@include for-tablet-up {\n\t\tgrid-template-columns: repeat(12, 1fr);\n\t\tmax-width: 1128px;\n\t\tmargin: 0 24px;\n\t}\n}\n\n@for $i from 1 through 4 {\n\t.sm-col-span-#{$i} {\n\t\tgrid-column-end: span #{$i};\n\t}\n}\n\n@include for-phone-up {\n\t@for $i from 1 through 8 {\n\t\t.md-col-span-#{$i} {\n\t\t\tgrid-column-end: span #{$i};\n\t\t}\n\t}\n}\n\n@include for-tablet-up {\n\t@for $i from 1 through 12 {\n\t\t.lg-col-span-#{$i} {\n\t\t\tgrid-column-end: span #{$i};\n\t\t}\n\t}\n}\n\n@include for-tablet-down {\n\t.md-col-span-0 {\n\t\tdisplay: none;\n\t}\n}\n\n@include for-phone-down {\n\t.sm-col-span-0 {\n\t\tdisplay: none;\n\t}\n}\n\n.jp-wrap {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-wrap: wrap;\n\tmax-width: 1128px;\n\tmargin: 0 auto;\n}\n\n.jp-row {\n\tdisplay: grid;\n\tgrid-gap: 24px;\n\tgrid-template-columns: repeat(4, 1fr);\n\twidth: 100%;\n\tmargin: 0 16px;\n\t\n\t@include for-phone-up {\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tmargin: 0 18px;\n\t}\n\t\n\t@include for-tablet-up {\n\t\tgrid-template-columns: repeat(12, 1fr);\n\t\tmax-width: 1128px;\n\t\tmargin: 0 24px;\n\t}\n}\n\n.jp-cut {\n\tposition: relative;\n\tdisplay: block;\n\tmargin: 32px 0;\n\tpadding: 16px 64px 16px 24px;\n\tborder: 2px solid var( --jp-green-primary );\n\tborder-radius: var( --jp-border-radius );\n\ttext-decoration: none;\n\n\tspan {\n\t\tdisplay: block;\n\n\t\t&:last-of-type {\n\t\t\tfont-weight: 600;\n\t\t}\n\t}\n\n\t&:hover,\n\t&:focus {\n\t\t//box-shadow: 0px 0px 40px rgba( 0, 0, 0, 0.08 );\n\n\t\tspan:last-of-type {\n\t\t\ttext-decoration: underline;\n\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t}\n\n\t\t&:after {\n\t\t\ttransform: translateY( -50% ) translateX( 8px );\n\t\t}\n\t}\n\n\t&:after {\n\t\tcontent: \"→\";\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\tright: 24px;\n\t\tfont-size: 24px;\n\t\tfont-weight: 600;\n\t\tcolor: var( --jp-green-primary );\n\t\ttransform: translateY( -50% );\n\t\ttransition: transform 0.15s ease-out;\n\t}\n}\n","@import '../rna-styles';\n\n.jp-disconnect-dialog {\n\th1 {\n\t\tmargin-top: 0;\n\t\tline-height: 1.2;\n\t\tfont-size: var( --font-title-large );\n\t\tfont-weight: 600;\n\t}\n\n\th2 {\n\t\tmargin: 0;\n\t\tline-height: 1.2;\n\t\tfont-size: var( --font-title-small );\n\t\tfont-weight: 400;\n\t}\n\n\tp {\n\t\tfont-size: var( --font-body );\n\t}\n\n\t&__link{\n\t\tfont-size: var( --font-body );\n\t\tcolor: var( --jp-black );\n\t\ttext-decoration: underline;\n\t\theight: auto;\n\t\tfont: inherit;\n\t\tpadding: 0;\n\n\t\t&:hover {\n\t\t\tcolor: var( --jp-black );\n\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t}\n\n\t\t&:focus {\n\t\t\tcolor: var( --jp-black );\n\t\t\tbox-shadow: none !important;\n\t\t}\n\t}\n\n\t.components-button{\n\t\theight: 40px;\n\t\tfont-size: var( --font-body-small );\n\t\tborder-radius: 4px;\n\t}\n\n\t.components-modal{\n\t\t&__content{\n\t\t\tpadding: 0;\n\t\t}\n\n\t\t&__header{\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\t.jp-row {\n\t\talign-items: center;\n\t}\n\n\t&__content{\n\t\tbackground: var( --jp-white-off );\n\t\tmargin: 0;\n\t\tpadding: 80px;\n\t\tborder-radius: 4px;\n\t\ttext-align: center;\n\t}\n\n\t&__actions{\n\t\tbackground: var( --jp-white );\n\t\tpadding: 10px 48px;\n\t}\n\n\t&__btn-dismiss{\n\t\tbackground: var( --jp-black ) !important;\n\t\tmargin-right: 10px;\n\t}\n\n\t&__btn-disconnect{\n\t\tbackground: var( --jp-red ) !important;\n\t}\n\n\t&__btn-back-to-wp{\n\t\tbackground: var( --jp-black ) !important;\n\t}\n\n\t&__button-wrap{\n\t\ttext-align: center;\n\t}\n\n\t&__error{\n\t\tcolor: var( --jp-red );\n\t}\n\n\t&__success{\n\n\t\t.components-modal{\n\n\t\t\t&__content {\n\t\t\t\tbackground: var( --jp-white );\n\t\t\t\tpadding: 50px;\n\t\t\t}\n\t\t}\n\n\t\th1 {\n\t\t\tmargin-top: 20px;\n\t\t}\n\t}\n}\n\n\n@media (min-width: 960px){\n\t.jp-disconnect-dialog{\n\t\tmin-width: 900px;\n\t\t\n\t\t&__success{\n\t\t\tmin-width: auto;\n\t\t}\n\t}\n\n\t.jp-row {\n\t\tmargin-left: 0px;\n\t}\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file +{"version":3,"file":"index.css","mappings":"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DD;AC9JC;EA+FD;IAQE;IACA;ED2DA;AACF;ACjKC;EA4FD;IAaE;IACA;IACA;ED4DA;AACF;;ACzDA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AD4DD;AC1DC;EACC;AD4DF;AC1DE;EACC;AD4DH;ACpDE;EACC;EACA;ADsDH;ACnDE;EACC;ADqDH;ACjDC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ADmDF;;AA3OA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AA8OD;AA5OC;EATD;IAUE;EA+OA;AACF;AA5OE;EACC;EACA;AA8OH;AA1OC;EACC;EACA;EACA;EACA;AA4OF;AAzOC;EACC;EACA;AA2OF;AAxOC;EAEC;EACA;EACA;EACA;EACA;EACA;AAyOF;AAtOC;EACC;EACA;EACA;AAwOF;AArOC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AAuOF;AApOC;EACC;AAsOF;AAnOC;EACC;EACA;EACA;EACA;AAqOF;AAlOC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AAoOF;AAjOC;EACC;EACA;EACA;AAmOF;AAhOC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAkOF;AA/NC;EACC;EACA;EACA;EACA;AAiOF,C;;;;ALzUA;;EAAA;ACAA;;;;;CAAA;ACEA;;EAAA;AAqDA;;;;;EAAA;AA8DA;;EAAA;AA8BA;;EAAA;AAqCA;;EAAA;AAqBA;;EAAA;AAyKA;;;EAAA;AAcA;;EAAA;AKjYA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAmCD;ALVC;EKlCD;IAYE;EAoCA;AACF;AAlCC;EACC;EACA;AAoCF;AAlCE;EACC;EACA;EACA;AAoCH;AAhCC;EACC;EACA;EACA;EACA;AAkCF;AA/BC;EACC;EACA;EACA;EACA;AAiCF;AA9BC;EACC;EACA;EACA;EACA;EACA;AAgCF;AA7BC;EACC;EACA;EACA;EACA;AA+BF;AA7BE;EAND;IAOE;EAgCD;AACF;AA9BE;EACC;EACA;EACA;EACA;EACA;EACA;AAgCH;AA7BE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AA+BH;ALzEC;EKiCC;IAYE;EAgCF;AACF;AA9BG;EACC;EACA;EACA;EACA;AAgCJ;AA7BG;EACC;AA+BJ;AA5BG;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AA8BJ;AA3BG;EACC;EACA;AA6BJ;AA1BG;EACC;EACA;AA4BJ;AAvBC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAyBF;AAtBC;EACC;EACA;AAwBF;AArBC;EACC;EACA;EACA;EACA;EACA;EACA;AAuBF;AArBE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAuBH;AApBE;EACC;AAsBH;AAnBE;EACC;AAqBH;AAlBE;;EAEC;AAoBH;AAjBE;EAjCD;IAkCE;IACA;EAoBD;EAlBC;IACC;EAoBF;EAjBC;IACC;EAmBF;EAhBC;IACC;EAkBF;AACF,C;;;;AC7MA;EACC;AACD;AACC;EACC;EACA;EACA;AACF;AAEC;EACC;EACA;AAAF,C;;;;ACXA,gBAAgB;ACAhB;AAGA;EACC;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;ADHD;;ACMA;AAeA;AAGA;EACC;ADnBD;;ACsBA;EACC;EACA;EACA;EACA;ADnBD;;ACqBA;EACC;EACA;EACA;EACA;EACA;ADlBD;;ACqBA;EACC;EACA;EACA;EACA;EACA;ADlBD;ACrBC;EAkCD;IAQE;IACA;EDjBA;AACF;ACxBC;EA+BD;IAaE;IACA;IACA;EDhBA;AACF;;ACoBC;EACC;ADjBF;;ACgBC;EACC;ADbF;;ACYC;EACC;ADTF;;ACQC;EACC;ADLF;;AClDC;EA6DC;IACC;EDPD;;ECMA;IACC;EDHD;;ECEA;IACC;EDCD;;ECFA;IACC;EDKD;;ECNA;IACC;EDSD;;ECVA;IACC;EDaD;;ECdA;IACC;EDiBD;;EClBA;IACC;EDqBD;AACF;ACjFC;EAkEC;IACC;EDkBD;;ECnBA;IACC;EDsBD;;ECvBA;IACC;ED0BD;;EC3BA;IACC;ED8BD;;EC/BA;IACC;EDkCD;;ECnCA;IACC;EDsCD;;ECvCA;IACC;ED0CD;;EC3CA;IACC;ED8CD;;EC/CA;IACC;EDkDD;;ECnDA;IACC;EDsDD;;ECvDA;IACC;ED0DD;;EC3DA;IACC;ED8DD;AACF;AC3HC;EAkEA;IACC;ED4DA;AACF;ACnIC;EA2EA;IACC;ED2DA;AACF;ACxDA;EACC;EACA;EACA;EACA;EACA;AD0DD;;ACvDA;EACC;EACA;EACA;EACA;EACA;AD0DD;AC9JC;EA+FD;IAQE;IACA;ED2DA;AACF;ACjKC;EA4FD;IAaE;IACA;IACA;ED4DA;AACF;;ACzDA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AD4DD;AC1DC;EACC;AD4DF;AC1DE;EACC;AD4DH;ACpDE;EACC;EACA;ADsDH;ACnDE;EACC;ADqDH;ACjDC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ADmDF;;AArOC;EACC;EACA;EACA;EACA;EACA;AAwOF;AArOC;EACC;AAuOF;AApOC;EACC;EACA;AAsOF;AAnOC;EACC;EACA;AAqOF;AAlOC;EACC;EACA;EACA;AAoOF;AAjOC;EACC;EACA;EACA;EACA;AAmOF;AAhOC;EACC;EACA;EACA;EACA;AAkOF;AA/NC;EACC;EACA;EACA;EACA;AAiOF;AA9NC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAgOF;AA7NC;EACC;EACA;EACA;AA+NF;AA7NE;EACC;AA+NH;AA3NC;EACC;EAEA;AA4NF;AA1NE;EACC;EACA;EACA;AA4NH;AAzNE;EACC;AA2NH;AAxNE;EACC;EACA;AA0NH,C;;;;AErTA,gBAAgB;ADAhB;AAGA;EACC;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;ACHD;;ADMA;AAeA;AAGA;EACC;ACnBD;;ADsBA;EACC;EACA;EACA;EACA;ACnBD;;ADqBA;EACC;EACA;EACA;EACA;EACA;AClBD;;ADqBA;EACC;EACA;EACA;EACA;EACA;AClBD;ADrBC;EAkCD;IAQE;IACA;ECjBA;AACF;ADxBC;EA+BD;IAaE;IACA;IACA;EChBA;AACF;;ADoBC;EACC;ACjBF;;ADgBC;EACC;ACbF;;ADYC;EACC;ACTF;;ADQC;EACC;ACLF;;ADlDC;EA6DC;IACC;ECPD;;EDMA;IACC;ECHD;;EDEA;IACC;ECCD;;EDFA;IACC;ECKD;;EDNA;IACC;ECSD;;EDVA;IACC;ECaD;;EDdA;IACC;ECiBD;;EDlBA;IACC;ECqBD;AACF;ADjFC;EAkEC;IACC;ECkBD;;EDnBA;IACC;ECsBD;;EDvBA;IACC;EC0BD;;ED3BA;IACC;EC8BD;;ED/BA;IACC;ECkCD;;EDnCA;IACC;ECsCD;;EDvCA;IACC;EC0CD;;ED3CA;IACC;EC8CD;;ED/CA;IACC;ECkDD;;EDnDA;IACC;ECsDD;;EDvDA;IACC;EC0DD;;ED3DA;IACC;EC8DD;AACF;AD3HC;EAkEA;IACC;EC4DA;AACF;ADnIC;EA2EA;IACC;EC2DA;AACF;ADxDA;EACC;EACA;EACA;EACA;EACA;AC0DD;;ADvDA;EACC;EACA;EACA;EACA;EACA;AC0DD;AD9JC;EA+FD;IAQE;IACA;EC2DA;AACF;ADjKC;EA4FD;IAaE;IACA;IACA;EC4DA;AACF;;ADzDA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AC4DD;AD1DC;EACC;AC4DF;AD1DE;EACC;AC4DH;ADpDE;EACC;EACA;ACsDH;ADnDE;EACC;ACqDH;ADjDC;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ACmDF;;AArOC;EACC;EACA;EACA;EACA;AAwOF;AArOC;EACC;EACA;EACA;EACA;AAuOF;AApOC;EACC;AAsOF;AAnOC;EACC;EACA;EACA;EACA;EACA;EACA;AAqOF;AAnOE;EACC;EACA;AAqOH;AAlOE;EACC;EACA;AAoOH;AAhOC;EACC;EACA;EACA;AAkOF;AA9NE;EACC;AAgOH;AA7NE;EACC;AA+NH;AA3NC;EACC;AA6NF;AA1NC;EACC;EACA;EACA;EACA;EACA;AA4NF;AAzNC;EACC;EACA;AA2NF;AAxNC;EACC;EACA;AA0NF;AAvNC;EACC;AAyNF;AAtNC;EACC;AAwNF;AArNC;EACC;AAuNF;AApNC;EACC;AAsNF;AA/MG;EACC;EACA;AAiNJ;AA7ME;EACC;AA+MH;;AAzMA;EACC;IACC;EA4MA;EA1MA;IACC;EA4MD;;EAxMD;IACC;EA2MA;AACF,C","sources":["webpack://jetpack-connection-manager-ui/./_inc/components/header/style.scss","webpack://jetpack-connection-manager-ui/./_inc/components/admin/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/components/components/action-button/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/components/components/spinner/style.scss","webpack://jetpack-connection-manager-ui/../../../node_modules/.pnpm/@wordpress+base-styles@4.0.3/node_modules/@wordpress/base-styles/_breakpoints.scss","webpack://jetpack-connection-manager-ui/../../../node_modules/.pnpm/@wordpress+base-styles@4.0.3/node_modules/@wordpress/base-styles/_functions.scss","webpack://jetpack-connection-manager-ui/../../../node_modules/.pnpm/@wordpress+base-styles@4.0.3/node_modules/@wordpress/base-styles/_mixins.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/connect-screen/required-plan/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/connect-screen/layout/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/components/components/pricing-card/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/components/components/rna-styles.scss","webpack://jetpack-connection-manager-ui/../../js-packages/idc/components/idc-screen/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/idc/components/safe-mode/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/connection-status-card/style.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/rna-styles.scss","webpack://jetpack-connection-manager-ui/../../js-packages/connection/components/disconnect-dialog/style.scss"],"sourcesContent":["#jetpack-connection-ui-container .jetpack-cui__header {\n\th1 {\n\t\ttext-align: left;\n\t\tfont-size: 4.6em;\n\t\tline-height: 1.2em;\n\t}\n}\n","#jetpack-connection-ui-container {\n\tmargin: 40px;\n\n\tp {\n\t\tfont-size: 1.23em;\n\t\tline-height: 1.5em;\n\t}\n}\n",".jp-action-button {\n\t&--button {\n\t\tbackground: #000;\n\t\tborder-radius: 4px;\n\t\tfont-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif;\n\t\tfont-style: normal;\n\t\tfont-weight: 600;\n\t\tfont-size: 14px;\n\t\tline-height: 18px;\n\t\ttext-align: center;\n\t\twidth: 264px;\n\t\theight: 40px;\n\t\tdisplay: block;\n\t}\n\t&__error{\n\t\tcolor: var( --jp-red ) !important;\n\t\tline-height: 25px !important;\n\t\tpadding-left: 25px;\n\t\tbackground: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDIwQzE2LjQxODMgMjAgMjAgMTYuNDE4MyAyMCAxMkMyMCA3LjU4MTcyIDE2LjQxODMgNCAxMiA0QzcuNTgxNzIgNCA0IDcuNTgxNzIgNCAxMkM0IDE2LjQxODMgNy41ODE3MiAyMCAxMiAyMFoiIHN0cm9rZT0iI0Q2MzYzOSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPHBhdGggZD0iTTEzIDdIMTFWMTNIMTNWN1oiIGZpbGw9IiNENjM2MzkiLz4KPHBhdGggZD0iTTEzIDE1SDExVjE3SDEzVjE1WiIgZmlsbD0iI0Q2MzYzOSIvPgo8L3N2Zz4K\") no-repeat 0 0;\n\t}\n}\n","@keyframes rotate-spinner {\n\t100% {\n\t\ttransform: rotate( 360deg );\n\t}\n}\n\n.jp-components-spinner {\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.jp-components-spinner__outer, .jp-components-spinner__inner {\n\tmargin: auto;\n\tbox-sizing: border-box;\n\tborder: 0.1em solid transparent;\n\tborder-radius: 50%;\n\tanimation: 3s linear infinite;\n\tanimation-name: rotate-spinner;\n}\n\n.jp-components-spinner__outer {\n\tborder-top-color: white;\n}\n\n.jp-components-spinner__inner {\n\twidth: 100%;\n\theight: 100%;\n\tborder-top-color: white;\n\tborder-right-color: white;\n\topacity: 0.4;\n}\n","/**\n * Breakpoints & Media Queries\n */\n\n// Most used breakpoints\n$break-huge: 1440px;\n$break-wide: 1280px;\n$break-xlarge: 1080px;\n$break-large: 960px;\t// admin sidebar auto folds\n$break-medium: 782px;\t// adminbar goes big\n$break-small: 600px;\n$break-mobile: 480px;\n$break-zoomed-in: 280px;\n\n// All media queries currently in WordPress:\n//\n// min-width: 2000px\n// min-width: 1680px\n// min-width: 1250px\n// max-width: 1120px *\n// max-width: 1000px\n// min-width: 769px and max-width: 1000px\n// max-width: 960px *\n// max-width: 900px\n// max-width: 850px\n// min-width: 800px and max-width: 1499px\n// max-width: 800px\n// max-width: 799px\n// max-width: 782px *\n// max-width: 768px\n// max-width: 640px *\n// max-width: 600px *\n// max-width: 520px\n// max-width: 500px\n// max-width: 480px *\n// max-width: 400px *\n// max-width: 380px\n// max-width: 320px *\n//\n// Those marked * seem to be more commonly used than the others.\n// Let's try and use as few of these as possible, and be mindful about adding new ones, so we don't make the situation worse\n","/**\n* Converts a hex value into the rgb equivalent.\n*\n* @param {string} hex - the hexadecimal value to convert\n* @return {string} comma separated rgb values\n*/\n@function hex-to-rgb($hex) {\n\t@return red($hex), green($hex), blue($hex);\n}\n","@import \"./functions\";\n\n/**\n * Breakpoint mixins\n */\n\n@mixin break-huge() {\n\t@media (min-width: #{ ($break-huge) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-wide() {\n\t@media (min-width: #{ ($break-wide) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-xlarge() {\n\t@media (min-width: #{ ($break-xlarge) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-large() {\n\t@media (min-width: #{ ($break-large) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-medium() {\n\t@media (min-width: #{ ($break-medium) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-small() {\n\t@media (min-width: #{ ($break-small) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-mobile() {\n\t@media (min-width: #{ ($break-mobile) }) {\n\t\t@content;\n\t}\n}\n\n@mixin break-zoomed-in() {\n\t@media (min-width: #{ ($break-zoomed-in) }) {\n\t\t@content;\n\t}\n}\n\n\n/**\n * Long content fade mixin\n *\n * Creates a fading overlay to signify that the content is longer\n * than the space allows.\n */\n\n@mixin long-content-fade($direction: right, $size: 20%, $color: #fff, $edge: 0, $z-index: false) {\n\tcontent: \"\";\n\tdisplay: block;\n\tposition: absolute;\n\t-webkit-touch-callout: none;\n\t-webkit-user-select: none;\n\t-khtml-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n\tpointer-events: none;\n\n\t@if $z-index {\n\t\tz-index: $z-index;\n\t}\n\n\t@if $direction == \"bottom\" {\n\t\tbackground: linear-gradient(to top, rgba($color, 0), $color 90%);\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\ttop: $edge;\n\t\tbottom: calc(100% - $size);\n\t\twidth: auto;\n\t}\n\n\t@if $direction == \"top\" {\n\t\tbackground: linear-gradient(to bottom, rgba($color, 0), $color 90%);\n\t\ttop: calc(100% - $size);\n\t\tleft: $edge;\n\t\tright: $edge;\n\t\tbottom: $edge;\n\t\twidth: auto;\n\t}\n\n\t@if $direction == \"left\" {\n\t\tbackground: linear-gradient(to left, rgba($color, 0), $color 90%);\n\t\ttop: $edge;\n\t\tleft: $edge;\n\t\tbottom: $edge;\n\t\tright: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n\n\t@if $direction == \"right\" {\n\t\tbackground: linear-gradient(to right, rgba($color, 0), $color 90%);\n\t\ttop: $edge;\n\t\tbottom: $edge;\n\t\tright: $edge;\n\t\tleft: auto;\n\t\twidth: $size;\n\t\theight: auto;\n\t}\n}\n\n/**\n * Focus styles.\n */\n\n@mixin block-toolbar-button-style__focus() {\n\tbox-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 4px $white;\n\n\t// Windows High Contrast mode will show this outline, but not the box-shadow.\n\toutline: 2px solid transparent;\n}\n\n// Tabs, Inputs, Square buttons.\n@mixin input-style__neutral() {\n\tbox-shadow: 0 0 0 transparent;\n\ttransition: box-shadow 0.1s linear;\n\tborder-radius: $radius-block-ui;\n\tborder: $border-width solid $gray-700;\n\t@include reduce-motion(\"transition\");\n}\n\n\n@mixin input-style__focus() {\n\tborder-color: var(--wp-admin-theme-color);\n\tbox-shadow: 0 0 0 ($border-width-focus - $border-width) var(--wp-admin-theme-color);\n\n\t// Windows High Contrast mode will show this outline, but not the box-shadow.\n\toutline: 2px solid transparent;\n}\n\n\n/**\n * Applies editor left position to the selector passed as argument\n */\n\n@mixin editor-left($selector) {\n\t#{$selector} { /* Set left position when auto-fold is not on the body element. */\n\t\tleft: 0;\n\n\t\t@media (min-width: #{ ($break-medium + 1) }) {\n\t\t\tleft: $admin-sidebar-width;\n\t\t}\n\t}\n\n\t.auto-fold #{$selector} { /* Auto fold is when on smaller breakpoints, nav menu auto collapses. */\n\t\t@media (min-width: #{ ($break-medium + 1) }) {\n\t\t\tleft: $admin-sidebar-width-collapsed;\n\t\t}\n\n\t\t@media (min-width: #{ ($break-large + 1) }) {\n\t\t\tleft: $admin-sidebar-width;\n\t\t}\n\t}\n\n\t/* Sidebar manually collapsed. */\n\t.folded #{$selector} {\n\t\tleft: 0;\n\n\t\t@media (min-width: #{ ($break-medium + 1) }) {\n\t\t\tleft: $admin-sidebar-width-collapsed;\n\t\t}\n\t}\n\n\tbody.is-fullscreen-mode #{$selector} {\n\t\tleft: 0 !important;\n\t}\n}\n\n/**\n * Styles that are reused verbatim in a few places\n */\n\n// These are additional styles for all captions, when the theme opts in to block styles.\n@mixin caption-style() {\n\tmargin-top: 0.5em;\n\tmargin-bottom: 1em;\n}\n\n@mixin caption-style-theme() {\n\tcolor: #555;\n\tfont-size: $default-font-size;\n\ttext-align: center;\n\n\t.is-dark-theme & {\n\t\tcolor: $light-gray-placeholder;\n\t}\n}\n\n\n/**\n * Allows users to opt-out of animations via OS-level preferences.\n */\n\n@mixin reduce-motion($property: \"\") {\n\n\t@if $property == \"transition\" {\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition-duration: 0s;\n\t\t\ttransition-delay: 0s;\n\t\t}\n\t}\n\n\t@else if $property == \"animation\" {\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\tanimation-duration: 1ms;\n\t\t\tanimation-delay: 0s;\n\t\t}\n\t}\n\n\t@else {\n\t\t@media (prefers-reduced-motion: reduce) {\n\t\t\ttransition-duration: 0s;\n\t\t\ttransition-delay: 0s;\n\t\t\tanimation-duration: 1ms;\n\t\t\tanimation-delay: 0s;\n\t\t}\n\t}\n\n}\n\n@mixin input-control {\n\tfont-family: $default-font;\n\tpadding: 6px 8px;\n\t@include input-style__neutral();\n\n\t/* Fonts smaller than 16px causes mobile safari to zoom. */\n\tfont-size: $mobile-text-min-font-size;\n\t/* Override core line-height. To be reviewed. */\n\tline-height: normal;\n\t@include break-small {\n\t\tfont-size: $default-font-size;\n\t\t/* Override core line-height. To be reviewed. */\n\t\tline-height: normal;\n\t}\n\n\t&:focus {\n\t\t@include input-style__focus();\n\t}\n\n\t// Use opacity to work in various editor styles.\n\t&::-webkit-input-placeholder {\n\t\tcolor: $dark-gray-placeholder;\n\t}\n\n\t&::-moz-placeholder {\n\t\topacity: 1; // Necessary because Firefox reduces this from 1.\n\t\tcolor: $dark-gray-placeholder;\n\t}\n\n\t&:-ms-input-placeholder {\n\t\tcolor: $dark-gray-placeholder;\n\t}\n}\n\n@mixin checkbox-control {\n\t@include input-control;\n\tborder: $border-width solid $gray-900;\n\tmargin-right: $grid-unit-15;\n\ttransition: none;\n\tborder-radius: $radius-block-ui;\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 ($border-width * 2) $white, 0 0 0 ($border-width * 2 + $border-width-focus) var(--wp-admin-theme-color);\n\n\t\t// Only visible in Windows High Contrast mode.\n\t\toutline: 2px solid transparent;\n\t}\n\n\t&:checked {\n\t\tbackground: var(--wp-admin-theme-color);\n\t\tborder-color: var(--wp-admin-theme-color);\n\n\t\t// Hide default checkbox styles in IE.\n\t\t&::-ms-check {\n\t\t\topacity: 0;\n\t\t}\n\t}\n\n\t&:checked::before,\n\t&[aria-checked=\"mixed\"]::before {\n\t\tmargin: -3px -5px;\n\t\tcolor: $white;\n\n\t\t@include break-medium() {\n\t\t\tmargin: -4px 0 0 -5px;\n\t\t}\n\t}\n\n\t&[aria-checked=\"mixed\"] {\n\t\tbackground: var(--wp-admin-theme-color);\n\t\tborder-color: var(--wp-admin-theme-color);\n\n\t\t&::before {\n\t\t\t// Inherited from `forms.css`.\n\t\t\t// See: https://github.com/WordPress/wordpress-develop/tree/5.1.1/src/wp-admin/css/forms.css#L122-L132\n\t\t\tcontent: \"\\f460\";\n\t\t\tfloat: left;\n\t\t\tdisplay: inline-block;\n\t\t\tvertical-align: middle;\n\t\t\twidth: 16px;\n\t\t\t/* stylelint-disable */\n\t\t\tfont: normal 30px/1 dashicons;\n\t\t\t/* stylelint-enable */\n\t\t\tspeak: none;\n\t\t\t-webkit-font-smoothing: antialiased;\n\t\t\t-moz-osx-font-smoothing: grayscale;\n\n\t\t\t@include break-medium() {\n\t\t\t\tfloat: none;\n\t\t\t\tfont-size: 21px;\n\t\t\t}\n\t\t}\n\t}\n}\n\n@mixin radio-control {\n\t@include input-control;\n\tborder: $border-width solid $gray-900;\n\tmargin-right: $grid-unit-15;\n\ttransition: none;\n\tborder-radius: $radius-round;\n\twidth: $radio-input-size-sm;\n\theight: $radio-input-size-sm;\n\n\t@include break-small() {\n\t\theight: $radio-input-size;\n\t\twidth: $radio-input-size;\n\t}\n\n\t&:checked::before {\n\t\tbox-sizing: inherit;\n\t\twidth: 8px;\n\t\theight: 8px;\n\t\ttransform: translate(7px, 7px);\n\t\tmargin: 0;\n\t\tbackground-color: $white;\n\n\t\t// This border serves as a background color in Windows High Contrast mode.\n\t\tborder: 4px solid $white;\n\n\t\t@include break-small() {\n\t\t\ttransform: translate(5px, 5px);\n\t\t}\n\t}\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 ($border-width * 2) $white, 0 0 0 ($border-width * 2 + $border-width-focus) var(--wp-admin-theme-color);\n\n\t\t// Only visible in Windows High Contrast mode.\n\t\toutline: 2px solid transparent;\n\t}\n\n\t&:checked {\n\t\tbackground: var(--wp-admin-theme-color);\n\t\tborder-color: var(--wp-admin-theme-color);\n\t}\n}\n\n/**\n * Reset default styles for JavaScript UI based pages.\n * This is a WP-admin agnostic reset\n */\n@mixin reset {\n\tbox-sizing: border-box;\n\n\t*,\n\t*::before,\n\t*::after {\n\t\tbox-sizing: inherit;\n\t}\n}\n\n/**\n * Reset the WP Admin page styles for Gutenberg-like pages.\n */\n@mixin wp-admin-reset( $content-container ) {\n\tbackground: $white;\n\n\t#wpcontent {\n\t\tpadding-left: 0;\n\t}\n\n\t#wpbody-content {\n\t\tpadding-bottom: 0;\n\t}\n\n\t/* We hide legacy notices in Gutenberg Based Pages, because they were not designed in a way that scaled well.\n\t Plugins can use Gutenberg notices if they need to pass on information to the user when they are editing. */\n\t#wpbody-content > div:not(#{ $content-container }):not(#screen-meta) {\n\t\tdisplay: none;\n\t}\n\n\t#wpfooter {\n\t\tdisplay: none;\n\t}\n\n\t.a11y-speak-region {\n\t\tleft: -1px;\n\t\ttop: -1px;\n\t}\n\n\tul#adminmenu a.wp-has-current-submenu::after,\n\tul#adminmenu > li.current > a.current::after {\n\t\tborder-right-color: $white;\n\t}\n\n\t.media-frame select.attachment-filters:last-of-type {\n\t\twidth: auto;\n\t\tmax-width: 100%;\n\t}\n}\n\n@mixin admin-scheme($color-primary) {\n\t// Define RGB equivalents for use in rgba function.\n\t// Hexadecimal css vars do not work in the rgba function.\n\t--wp-admin-theme-color: #{$color-primary};\n\t--wp-admin-theme-color--rgb: #{hex-to-rgb($color-primary)};\n\t// Darker shades.\n\t--wp-admin-theme-color-darker-10: #{darken($color-primary, 5%)};\n\t--wp-admin-theme-color-darker-10--rgb: #{hex-to-rgb(darken($color-primary, 5%))};\n\t--wp-admin-theme-color-darker-20: #{darken($color-primary, 10%)};\n\t--wp-admin-theme-color-darker-20--rgb: #{hex-to-rgb(darken($color-primary, 10%))};\n\n\t// Focus style width.\n\t// Avoid rounding issues by showing a whole 2px for 1x screens, and 1.5px on high resolution screens.\n\t--wp-admin-border-width-focus: 2px;\n\t@media ( -webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {\n\t\t--wp-admin-border-width-focus: 1.5px;\n\t}\n}\n\n@mixin wordpress-admin-schemes() {\n\tbody.admin-color-light {\n\t\t@include admin-scheme(#0085ba);\n\t}\n\n\tbody.admin-color-modern {\n\t\t@include admin-scheme(#3858e9);\n\t}\n\n\tbody.admin-color-blue {\n\t\t@include admin-scheme(#096484);\n\t}\n\n\tbody.admin-color-coffee {\n\t\t@include admin-scheme(#46403c);\n\t}\n\n\tbody.admin-color-ectoplasm {\n\t\t@include admin-scheme(#523f6d);\n\t}\n\n\tbody.admin-color-midnight {\n\t\t@include admin-scheme(#e14d43);\n\t}\n\n\tbody.admin-color-ocean {\n\t\t@include admin-scheme(#627c83);\n\t}\n\n\tbody.admin-color-sunrise {\n\t\t@include admin-scheme(#dd823b);\n\t}\n}\n\n// Deprecated from UI, kept for back-compat.\n@mixin background-colors-deprecated() {\n\t.has-very-light-gray-background-color {\n\t\tbackground-color: #eee;\n\t}\n\n\t.has-very-dark-gray-background-color {\n\t\tbackground-color: #313131;\n\t}\n}\n\n// Deprecated from UI, kept for back-compat.\n@mixin foreground-colors-deprecated() {\n\t.has-very-light-gray-color {\n\t\tcolor: #eee;\n\t}\n\n\t.has-very-dark-gray-color {\n\t\tcolor: #313131;\n\t}\n}\n\n// Deprecated from UI, kept for back-compat.\n@mixin gradient-colors-deprecated() {\n\t/*\n\t * Our classes uses the same values we set for gradient value attributes,\n\t * and we can not use spacing because of WP multi site kses rule.\n\t */\n\n\t/* stylelint-disable function-comma-space-after */\n\t.has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgba(0,208,132,1) 0%,rgba(6,147,227,1) 100%);\n\t}\n\n\t.has-purple-crush-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(52,226,228) 0%,rgb(71,33,251) 50%,rgb(171,29,254) 100%);\n\t}\n\n\t.has-hazy-dawn-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(250,172,168) 0%,rgb(218,208,236) 100%);\n\t}\n\n\t.has-subdued-olive-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(250,250,225) 0%,rgb(103,166,113) 100%);\n\t}\n\n\t.has-atomic-cream-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(253,215,154) 0%,rgb(0,74,89) 100%);\n\t}\n\n\t.has-nightshade-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(51,9,104) 0%,rgb(49,205,207) 100%);\n\t}\n\n\t.has-midnight-gradient-background {\n\t\tbackground: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);\n\t}\n\t/* stylelint-enable function-comma-space-after */\n}\n","@import '@wordpress/base-styles/breakpoints';\n@import '@wordpress/base-styles/mixins';\n\n.jp-connection__connect-screen-layout__left {\n\t@include break-xlarge {\n\t\twidth: 70%;\n\t}\n}\n\n.jp-connection__connect-screen-required-plan {\n\t@include break-xlarge {\n\t\tposition: relative;\n\t\tbackground: linear-gradient(to right, white 70%, #F9F9F6 30%);\n\t}\n\n\t&__loading {\n\t\tdisplay: none;\n\t}\n\n\t&__pricing-card {\n\n\t\t@include break-xlarge {\n\t\t\tposition: absolute;\n\t\t\ttop: 14%;\n\t\t\tleft: 62%;\n\t\t}\n\n\t\t.components-button {\n\t\t\twidth: 100%;\n\t\t\theight: auto;\n\t\t\tfont-size: 18px;\n\t\t\tfont-weight: 500;\n\t\t\tbackground: var( --jp-black ) !important;\n\t\t\tcolor: var( --jp-white ) !important;\n\t\t\tborder-radius: var( --jp-border-radius );\n\t\t\tpadding: 14px 24px;\n\t\t\tmargin: 24px 0px 32px;\n\t\t\tjustify-content: center;\n\t\t\talign-items: center;\n\t\t}\n\t}\n\n\t&__with-subscription {\n\t\tmargin-top: 38px;\n\n\t\t.jp-action-button {\n\t\t\tdisplay: inline;\n\t\t}\n\n\t\t.jp-action-button--button {\n\t\t\tdisplay: inline;\n\t\t\tfont-size: var( --font-title-small );\n\t\t\tline-height: 20px;\n\t\t\tcolor: var( --jp-black ) !important;\n\t\t\tbackground: inherit !important;\n\t\t\ttext-decoration: underline;\n\n\t\t\twidth: auto;\n\t\t\theight: auto;\n\t\t\tfont: inherit;\n\t\t\tpadding: 0;\n\n\t\t\t&:hover {\n\t\t\tbackground: inherit;\n\t\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t\t}\n\n\t\t\t&:focus {\n\t\t\t\tbackground: inherit;\n\t\t\t\tbox-shadow: none !important;\n\t\t\t}\n\t\t}\n\n\t\t.jp-components-spinner__inner, .jp-components-spinner__outer {\n\t\t\tborder-top-color: var( --jp-black ); \n\t\t\tborder-right-color: var( --jp-black ); \n\t\t}\n\t}\n}\n","@import '@wordpress/base-styles/breakpoints';\n@import '@wordpress/base-styles/mixins';\n\n.jp-connection__connect-screen-layout {\n\tbackground: var( --jp-white );\n\tbox-shadow: 0 0 40px rgba(0, 0, 0, 0.08);\n\tborder-radius: 4px;\n\n\t&__loading {\n\t\tdisplay: none;\n\t}\n\n\t&__left, &__right {\n\t\tbox-sizing: border-box;\n\t}\n\n\t&__left {\n\t\tpadding: 25px;\n\n\t\t@include break-small {\n\t\t\tpadding: 64px 96px;\n\t\t}\n\n\t\t.jetpack-logo {\n\t\t\tmargin-bottom: 24px;\n\t\t}\n\n\t\th2 {\n\t\t\tfont-style: normal;\n\t\t\tfont-weight: bold;\n\t\t\tfont-size: 36px;\n\t\t\tline-height: 40px;\n\t\t\tcolor: var( --jp-black );\n\t\t\tmargin-top: 32px;\n\t\t\tmargin-bottom: 0;\n\t\t}\n\n\t\th3 {\n\t\t\tfont-style: normal;\n\t\t\tfont-weight: 500;\n\t\t\tfont-size: 24px;\n\t\t\tline-height: 32px;\n\t\t\tcolor: var( --jp-black );\n\t\t\tmargin-top: 32px;\n\t\t\tmargin-bottom: 0;\n\t\t}\n\n\t\tp, li {\n\t\t\tfont-style: normal;\n\t\t\tfont-weight: normal;\n\t\t\tfont-size: 16px;\n\t\t\tline-height: 24px;\n\t\t}\n\n\t\tp {\n\t\t\tcolor: #101517;\n\t\t\tmargin: 16px 0;\n\t\t}\n\n\t\ta {\n\t\t\tfont-size: var( --font-body );\n\t\t\tcolor: var( --jp-black );\n\t\t\ttext-decoration: underline;\n\t\t\theight: auto;\n\t\t\tfont: inherit;\n\t\t\tpadding: 0;\n\n\t\t\t&:hover {\n\t\t\t\tcolor: var( --jp-black );\n\t\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t\t}\n\n\t\t\t&:focus {\n\t\t\t\tcolor: var( --jp-black );\n\t\t\t\tbox-shadow: none !important;\n\t\t\t}\n\t\t}\n\n\t\tul {\n\t\t\tlist-style-type: none;\n\t\t\tpadding: 0;\n\n\t\t\tli {\n\t\t\t\tbackground: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAANlBMVEVHcEwFnwUInggGnggGnggHnAcAnwUFnQcAnwcGnwkFnQgGnQgFnwcGnQYFnQcFnAcGnQkDnwdhiL0pAAAAEnRSTlMAMF//f2Aw7yBQ3+9gcIBgcED+HDbkAAAAZklEQVR4Ae3LNwICARDDQC0+cv7/Y8mwV9odSfWIcf/+VegnGkIvDaGXKvTTn/Gz+Uf5xTL0K1XotS7fs5H6GHvvaO8d7c3j7rdgHne/A/PYt/cO+R42oYdN6OEQetiFHo4A//6dAXqtBEkmtWutAAAAAElFTkSuQmCC) no-repeat;\n\t\t\t\tbackground-size: 24px;\n\t\t\t\tpadding-left: 30px;\n\t\t\t\tmargin-bottom: 9px;\n\t\t\t\tcolor: var( --jp-black );\n\t\t\t}\n\t\t}\n\t}\n\n\t&__right {\n\t\tpadding: 64px 0;\n\n\t\timg {\n\t\t\tmax-width: 100%;\n\t\t}\n\t}\n\n\t&__two-columns {\n\t\t.jp-connection__connect-screen-layout__left {\n\t\t\tfloat: left;\n\t\t\twidth: 100%;\n\n\t\t\t@include break-xlarge {\n\t\t\t\twidth: 52%;\n\t\t\t}\n\t\t}\n\n\t\t.jp-connection__connect-screen-layout__right {\n\t\t\tfloat: right;\n\t\t\twidth: 47%;\n\t\t\tbackground: #F9F9F6;\n\t\t\tdisplay: none;\n\n\t\t\t@include break-xlarge {\n\t\t\t\tdisplay: block;\n\t\t\t}\n\t\t}\n\t}\n\n\t&__clearfix {\n\t\tclear: both;\n\t}\n}\n","@import '../rna-styles';\n\n.jp-components__pricing-card {\n\twidth: -moz-fit-content;\n\twidth: fit-content;\n\tmax-width: 384px;\n\tpadding: 24px 24px 32px;\n\tbackground:var( --jp-white );\n\tbox-shadow: 0px 10px 40px rgba( 0, 0, 0, 0.08 );\n\tborder-radius: var( --jp-border-radius );\n\n\t@media screen and ( min-width: 600px ) {\n\t\tpadding: 32px 32px 44px;\n\t}\n\n\t&__icon {\n\t\timg {\n\t\t\theight: 32px;\n\t\t\twidth: 32px;\n\t\t}\n\t}\n\n\t&__title {\n\t\tmargin: 16px 0 24px;\n\t\tcolor: #101517;\n\t\tfont-size: 32px;\n\t\tline-height: 38px;\n\t}\n\n\t&__pricing {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t}\n\n\t&__price-before,\n\t&__price-after {\n\t\tdisplay: inline-block;\n\t\tmargin-bottom: 8px;\n\t\tpadding: 0 2px;\n\t\tfont-size: 54px;\n\t\tfont-weight: 700;\n\t\tline-height: 40px;\n\t}\n\n\t&__price-before {\n\t\tposition: relative;\n\t\tmargin-right: 16px;\n\t\tcolor: var( --jp-gray-20 );\n\t}\n\n\t&__price-strikethrough {\n\t\tposition: absolute;\n\t\twidth: 100%;\n\t\theight: 3px;\n\t\tleft: 0px;\n\t\ttop: 20px;\n\t\tbackground: var( --jp-pink );\n\t\tborder-radius: 1.5px;\n\t}\n\n\t&__price-after {\n\t\tcolor: var( --jp-black );\n\t}\n\n\t&__currency {\n\t\tvertical-align: super;\n\t\tfont-size: var( --font-title-small );\n\t\tfont-weight: 400;\n\t\tline-height: 20px;\n\t}\n\n\t&__price-details {\n\t\talign-self: flex-end;\n\t\tmargin-bottom: 8px;\n\t\tfont-size: 14px;\n\t\tfont-weight: 400;\n\t\tline-height: 17px;\n\t\tcolor: var( --jp-gray-50 );\n\t\tletter-spacing: -0.02em;\n\t}\n\n\t&__price-decimal {\n\t\tfont-size: var( --font-label );\n\t\tline-height: 14px;\n\t\tvertical-align: top;\n\t}\n\n\t&__button {\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tfont-size: 18px;\n\t\tbackground: var( --jp-black );\n\t\tcolor: var( --jp-white ) !important;\n\t\tborder-radius: var( --jp-border-radius );\n\t\tpadding: 14px 24px;\n\t\tmargin: 24px 0px 32px;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t&__info {\n\t\tfont-size: var( --font-label );\n\t\tline-height: 20px;\n\t\tletter-spacing: -0.02em;\n\t\tcolor: var( --jp-gray-60 );\n\t}\n}\n","/********* RNA styles *********/\n// We should extract this into a package\n\n:root {\n\t--font-title-large: 36px;\n\t--font-title-small: 24px;\n\t--font-body: 16px;\n\t--font-label: 12px;\n\t\n\t--jp-black: #000000;\n\t--jp-black-80: #2C3338;\n\t--jp-white: #FFFFFF;\n\t--jp-white-off: #F9F9F6;\n\t--jp-gray: #DCDCDE;\n\t--jp-gray-20: #A7AAAD;\n\t--jp-gray-40: #787C82;\n\t--jp-gray-50: #646970;\n\t--jp-gray-60: #50575E;\n\t--jp-gray-off: #E2E2DF;\n\t--jp-red: #D63639;\n\t--jp-pink: #C9356E;\n\n\t--jp-green-primary: #069E08;\n\t--jp-green-secondary: #2FB41F;\n\n\t--jp-border-radius: 4px;\n\t--jp-menu-border-height: 1px;\n\t--jp-underline-thickness: 2px;\n}\n\n/********* Mixins *********/\n@mixin for-phone-up {\n\t@media (min-width: 600px) { @content; }\n}\n@mixin for-tablet-up {\n\t@media (min-width: 960px) { @content; }\n}\n\n@mixin for-phone-down {\n\t@media (max-width: 600px) { @content; }\n}\n@mixin for-tablet-down {\n\t@media (max-width: 960px) { @content; }\n}\n\n/********* Generic styles *********/\n$wp-gray-dark: #23282D;\n\n* {\n\tbox-sizing: border-box;\n}\n\nbody {\n\tmin-height: 100%;\n\tmargin: 0;\n\tpadding: 0;\n\tfont-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen-Sans\", \"Ubuntu\", \"Cantarell\", \"Helvetica Neue\", sans-serif;\n}\n.jp-wrap {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-wrap: wrap;\n\tmax-width: 1128px;\n\tmargin: 0 auto;\n}\n\n.jp-row {\n\tdisplay: grid;\n\tgrid-gap: 24px;\n\tgrid-template-columns: repeat(4, 1fr);\n\twidth: 100%;\n\tmargin: 0 16px;\n\t\n\t@include for-phone-up {\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tmargin: 0 18px;\n\t}\n\t\n\t@include for-tablet-up {\n\t\tgrid-template-columns: repeat(12, 1fr);\n\t\tmax-width: 1128px;\n\t\tmargin: 0 24px;\n\t}\n}\n\n@for $i from 1 through 4 {\n\t.sm-col-span-#{$i} {\n\t\tgrid-column-end: span #{$i};\n\t}\n}\n\n@include for-phone-up {\n\t@for $i from 1 through 8 {\n\t\t.md-col-span-#{$i} {\n\t\t\tgrid-column-end: span #{$i};\n\t\t}\n\t}\n}\n\n@include for-tablet-up {\n\t@for $i from 1 through 12 {\n\t\t.lg-col-span-#{$i} {\n\t\t\tgrid-column-end: span #{$i};\n\t\t}\n\t}\n}\n\n@include for-tablet-down {\n\t.md-col-span-0 {\n\t\tdisplay: none;\n\t}\n}\n\n@include for-phone-down {\n\t.sm-col-span-0 {\n\t\tdisplay: none;\n\t}\n}\n\n.jp-wrap {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-wrap: wrap;\n\tmax-width: 1128px;\n\tmargin: 0 auto;\n}\n\n.jp-row {\n\tdisplay: grid;\n\tgrid-gap: 24px;\n\tgrid-template-columns: repeat(4, 1fr);\n\twidth: 100%;\n\tmargin: 0 16px;\n\t\n\t@include for-phone-up {\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tmargin: 0 18px;\n\t}\n\t\n\t@include for-tablet-up {\n\t\tgrid-template-columns: repeat(12, 1fr);\n\t\tmax-width: 1128px;\n\t\tmargin: 0 24px;\n\t}\n}\n\n.jp-cut {\n\tposition: relative;\n\tdisplay: block;\n\tmargin: 32px 0;\n\tpadding: 16px 64px 16px 24px;\n\tborder: 2px solid var( --jp-green-primary );\n\tborder-radius: var( --jp-border-radius );\n\ttext-decoration: none;\n\n\tspan {\n\t\tdisplay: block;\n\n\t\t&:last-of-type {\n\t\t\tfont-weight: 600;\n\t\t}\n\t}\n\n\t&:hover,\n\t&:focus {\n\t\t//box-shadow: 0px 0px 40px rgba( 0, 0, 0, 0.08 );\n\n\t\tspan:last-of-type {\n\t\t\ttext-decoration: underline;\n\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t}\n\n\t\t&:after {\n\t\t\ttransform: translateY( -50% ) translateX( 8px );\n\t\t}\n\t}\n\n\t&:after {\n\t\tcontent: \"→\";\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\tright: 24px;\n\t\tfont-size: 24px;\n\t\tfont-weight: 600;\n\t\tcolor: var( --jp-green-primary );\n\t\ttransform: translateY( -50% );\n\t\ttransition: transform 0.15s ease-out;\n\t}\n}\n","@import '@wordpress/base-styles/breakpoints';\n@import '@wordpress/base-styles/mixins';\n\n.jp-idc-screen-base {\n\tfont-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen-Sans', 'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif;\n\tbackground: white;\n\tpadding: 10px;\n\tbox-shadow: 0 0 40px rgba(0, 0, 0, 0.04);\n\tborder-radius: 4px;\n\tborder-left: 4px solid #E68B28;\n\tmax-width: 1128px;\n\tbox-sizing: border-box;\n\tmargin: 0 auto;\n\n\t@include break-small {\n\t\tpadding: 48px;\n\t}\n\n\t.jp-idc-header {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\n\t\t.jp-idc-logo-label {\n\t\t\tfont-size: 14px;\n\t\t\tline-height: 22px;\n\t\t\tmargin: -7px 0 0 8px;\n\t\t}\n\t}\n\n\th2 {\n\t\tmargin: 32px 0 16px;\n\t\tfont-weight: 600;\n\t\tfont-size: 24px;\n\t\tline-height: 28px;\n\t}\n\n\th3 {\n\t\tmargin: 24px 0 0;\n\t\tfont-weight: 600;\n\t\tfont-size: 20px;\n\t\tline-height: 28px;\n\t}\n\n\tp {\n\t\tmargin: 0;\n\t\tmax-width: 710px;\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tcolor: #2C3338;\n\t}\n\n\t.jp-idc-cards {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tflex-direction: column;\n\t\talign-items: center;\n\n\t\t@media only screen and (min-width: 1400px) {\n\t\t\tflex-direction: row;\n\t\t}\n\n\t\t.jp-idc-cards-separator {\n\t\t\tfont-weight: 600;\n\t\t\tfont-size: 20px;\n\t\t\tline-height: 28px;\n\t\t\tcolor: #23282D;\n\t\t\tmargin: 0 24px;\n\t\t\talign-self: center;\n\t\t}\n\n\t\t.jp-idc-card-action-base {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\tjustify-content: space-between;\n\t\t\tmax-width: 100%;\n\t\t\twidth: 480px;\n\t\t\tborder: 1px solid #C3C4C7;\n\t\t\tborder-radius: 4px;\n\t\t\tpadding: 10px;\n\t\t\tmargin: 24px 0;\n\n\t\t\t@include break-small {\n\t\t\t\tpadding: 24px;\n\t\t\t}\n\n\t\t\th4 {\n\t\t\t\tmargin: 0 0 8px;\n\t\t\t\tfont-weight: normal;\n\t\t\t\tfont-size: 20px;\n\t\t\t\tline-height: 28px;\n\t\t\t}\n\n\t\t\tp {\n\t\t\t\tmargin: 0 0 24px;\n\t\t\t}\n\n\t\t\t.jp-idc-card-action-sitename {\n\t\t\t\twidth: 100%;\n\t\t\t\tbackground: #F9F9F6;\n\t\t\t\tborder-radius: 33px;\n\t\t\t\tfont-weight: bold;\n\t\t\t\tfont-size: 16px;\n\t\t\t\tline-height: 24px;\n\t\t\t\tcolor: #2C3338;\n\t\t\t\ttext-align: center;\n\t\t\t\tpadding: 16px;\n\t\t\t\toverflow-wrap: anywhere;\n\t\t\t}\n\n\t\t\t.jp-idc-card-action-separator {\n\t\t\t\tmargin: 12px auto;\n\t\t\t\tdisplay: block;\n\t\t\t}\n\n\t\t\t.jp-idc-card-action-button {\n\t\t\t\twidth: 100%;\n\t\t\t\tpadding: 8px 24px;\n\t\t\t}\n\t\t}\n\t}\n\n\t.jp-idc-card-action-button {\n\t\tmargin-top: 24px;\n\t\tpadding: 8px;\n\t\theight: auto;\n\t\tmin-height: 40px;\n\t\tbackground: #000000;\n\t\tborder-radius: 4px;\n\t\tfont-weight: 600;\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tcolor: #FFFFFF;\n\t\tjustify-content: center;\n\t}\n\n\t.jp-idc-card-action-button-migrated {\n\t\twidth: 141px;\n\t\tmargin-top: 64px;\n\t}\n\n\t.jp-idc-card-migrated {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tflex-direction: column;\n\t\talign-items: center;\n\t\twidth: 100%;\n\t\tmargin-top: 24px;\n\n\t\t.jp-idc-card-migrated-hostname {\n\t\t\tborder: 1px solid #C3C4C7;\n\t\t\tborder-radius: 4px;\n\t\t\tpadding: 24px;\n\t\t\tfont-weight: bold;\n\t\t\tfont-size: 16px;\n\t\t\tline-height: 24px;\n\t\t\tcolor: #2C3338;\n\t\t\tflex-grow: 1;\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.jp-idc-card-migrated-separator-wide {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\t.jp-idc-card-migrated-separator {\n\t\t\tdisplay: block;\n\t\t}\n\n\t\t.jp-idc-card-migrated-separator,\n\t\t.jp-idc-card-migrated-separator-wide {\n\t\t\tmargin: 28px;\n\t\t}\n\n\t\t@media only screen and (min-width: 1400px) {\n\t\t\tflex-direction: row;\n\t\t\twidth: auto;\n\n\t\t\t.jp-idc-card-migrated-separator {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\n\t\t\t.jp-idc-card-migrated-separator-wide {\n\t\t\t\tdisplay: block;\n\t\t\t}\n\n\t\t\t.jp-idc-card-migrated-hostname {\n\t\t\t\twidth: auto;\n\t\t\t}\n\t\t}\n\t}\n}\n",".jp-idc-screen-base .jp-idc-safe-mode {\n\ttext-align: center;\n\n\t&, button {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t\tcolor: #2C3338;\n\t}\n\n\tbutton {\n\t\tpadding: 0;\n\t\ttext-decoration: underline;\n\t}\n}\n","@import '../rna-styles';\n\n.jp-connection-status-card {\n\th3 {\n\t\tfont-size: 36px;\n\t\tline-height: 40px;\n\t\tfont-weight: 400;\n\t\tcolor: var( --jp-black );\n\t\tmargin: 0;\n\t}\n\n\ta, a:active, a:hover {\n\t\tcolor: var( --jp-black );\n\t}\n\n\tp {\n\t\tmargin: 16px 0;\n\t\tcolor: var( --jp-black );\n\t}\n\n\tp, a, li {\n\t\tfont-size: 16px;\n\t\tline-height: 24px;\n\t}\n\n\t&--status {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tmargin: 24px 0 24px -6px;\n\t}\n\n\t&--cloud {\n\t\tbackground-image: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDIiIGhlaWdodD0iNDIiIHZpZXdCb3g9IjAgMCA0MiA0MiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPG1hc2sgaWQ9Im1hc2swIiBtYXNrLXR5cGU9ImFscGhhIiBtYXNrVW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4PSI3IiB5PSI5IiB3aWR0aD0iMjgiIGhlaWdodD0iMjEiPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTMwLjMzMjkgMTcuNjk2N0MzMC4zMzMxIDE3LjY3MDMgMzAuMzMzMyAxNy42NDM3IDMwLjMzMzMgMTcuNjE2OUMzMC4zMzMzIDEzLjM2NDQgMjYuNTcyNSA5LjkxNjk5IDIxLjkzMzMgOS45MTY5OUMxOC4wMTcxIDkuOTE2OTkgMTQuNzI3IDEyLjM3MzUgMTMuNzk2NSAxNS42OTczQzEzLjcwOTIgMTUuNjkzNyAxMy42MjE1IDE1LjY5MTkgMTMuNTMzMyAxNS42OTE5QzkuOTI1MDcgMTUuNjkxOSA3IDE4LjcwODQgNyAyMi40Mjk0QzcgMjYuMTUwNCA5LjkyNTA3IDI5LjE2NjkgMTMuNTMzMyAyOS4xNjY5TDEzLjU3MjIgMjkuMTY2N0gyOS4zNjgzQzI5LjM3ODYgMjkuMTY2OSAyOS4zODkgMjkuMTY2OSAyOS4zOTkzIDI5LjE2NjlDMzIuNDkyMSAyOS4xNjY5IDM0Ljk5OTMgMjYuNTgxMyAzNC45OTkzIDIzLjM5MTlDMzQuOTk5MyAyMC41MzA1IDMyLjk4MTQgMTguMTU1IDMwLjMzMjkgMTcuNjk2N1oiIGZpbGw9IndoaXRlIi8+CjwvbWFzaz4KPGcgbWFzaz0idXJsKCNtYXNrMCkiPgo8cGF0aCBkPSJNMzAuMzMyOSAxNy42OTY3TDI3LjcwODEgMTcuNjY3N0wyNy42ODM0IDE5LjkwMjJMMjkuODg1MyAyMC4yODM0TDMwLjMzMjkgMTcuNjk2N1pNMTMuNzk2NSAxNS42OTczTDEzLjY4OTMgMTguMzIwMUwxNS43NjQ0IDE4LjQwNDlMMTYuMzI0MyAxNi40MDQ5TDEzLjc5NjUgMTUuNjk3M1pNMTMuNTMzMyAyOS4xNjY5VjMxLjc5MTlIMTMuNTQxMkwxMy41MzMzIDI5LjE2NjlaTTEzLjU3MjIgMjkuMTY2N1YyNi41NDE3SDEzLjU2NDNMMTMuNTcyMiAyOS4xNjY3Wk0yOS4zNjgzIDI5LjE2NjdMMjkuMzgzMiAyNi41NDE3SDI5LjM2ODNWMjkuMTY2N1pNMzIuOTU3OCAxNy43MjU4QzMyLjk1ODEgMTcuNjg5NyAzMi45NTgzIDE3LjY1MzMgMzIuOTU4MyAxNy42MTY5SDI3LjcwODNDMjcuNzA4MyAxNy42MzM5IDI3LjcwODMgMTcuNjUwOSAyNy43MDgxIDE3LjY2NzdMMzIuOTU3OCAxNy43MjU4Wk0zMi45NTgzIDE3LjYxNjlDMzIuOTU4MyAxMS43MDQzIDI3LjgwMjYgNy4yOTE5OSAyMS45MzMzIDcuMjkxOTlWMTIuNTQyQzI1LjM0MjUgMTIuNTQyIDI3LjcwODMgMTUuMDI0NSAyNy43MDgzIDE3LjYxNjlIMzIuOTU4M1pNMjEuOTMzMyA3LjI5MTk5QzE2Ljk0ODcgNy4yOTE5OSAxMi41NDQ5IDEwLjQzMDkgMTEuMjY4NyAxNC45ODk2TDE2LjMyNDMgMTYuNDA0OUMxNi45MDkxIDE0LjMxNjIgMTkuMDg1NyAxMi41NDIgMjEuOTMzMyAxMi41NDJWNy4yOTE5OVpNMTMuOTAzNiAxMy4wNzQ0QzEzLjc4MDcgMTMuMDY5NCAxMy42NTcyIDEzLjA2NjkgMTMuNTMzMyAxMy4wNjY5VjE4LjMxNjlDMTMuNTg1NyAxOC4zMTY5IDEzLjYzNzggMTguMzE4IDEzLjY4OTMgMTguMzIwMUwxMy45MDM2IDEzLjA3NDRaTTEzLjUzMzMgMTMuMDY2OUM4LjM5OTc3IDEzLjA2NjkgNC4zNzUgMTcuMzM1NCA0LjM3NSAyMi40Mjk0SDkuNjI1QzkuNjI1IDIwLjA4MTQgMTEuNDUwNCAxOC4zMTY5IDEzLjUzMzMgMTguMzE2OVYxMy4wNjY5Wk00LjM3NSAyMi40Mjk0QzQuMzc1IDI3LjUyMzUgOC4zOTk3NyAzMS43OTE5IDEzLjUzMzMgMzEuNzkxOVYyNi41NDE5QzExLjQ1MDQgMjYuNTQxOSA5LjYyNSAyNC43Nzc0IDkuNjI1IDIyLjQyOTRINC4zNzVaTTEzLjU0MTIgMzEuNzkxOUwxMy41ODAxIDMxLjc5MTdMMTMuNTY0MyAyNi41NDE3TDEzLjUyNTUgMjYuNTQxOUwxMy41NDEyIDMxLjc5MTlaTTEzLjU3MjIgMzEuNzkxN0gyOS4zNjgzVjI2LjU0MTdIMTMuNTcyMlYzMS43OTE3Wk0yOS4zOTkzIDI2LjU0MTlDMjkuMzkzNyAyNi41NDE5IDI5LjM4ODQgMjYuNTQxOSAyOS4zODMyIDI2LjU0MTlMMjkuMzUzNCAzMS43OTE3QzI5LjM2ODggMzEuNzkxOSAyOS4zODQzIDMxLjc5MTkgMjkuMzk5MyAzMS43OTE5VjI2LjU0MTlaTTMyLjM3NDMgMjMuMzkxOUMzMi4zNzQzIDI1LjIwODIgMzAuOTY2OCAyNi41NDE5IDI5LjM5OTMgMjYuNTQxOVYzMS43OTE5QzM0LjAxNzQgMzEuNzkxOSAzNy42MjQzIDI3Ljk1NDMgMzcuNjI0MyAyMy4zOTE5SDMyLjM3NDNaTTI5Ljg4NTMgMjAuMjgzNEMzMS4yMzk2IDIwLjUxNzcgMzIuMzc0MyAyMS43NzA5IDMyLjM3NDMgMjMuMzkxOUgzNy42MjQzQzM3LjYyNDMgMTkuMjkwMSAzNC43MjMxIDE1Ljc5MjUgMzAuNzgwNiAxNS4xMTAyTDI5Ljg4NTMgMjAuMjgzNFoiIGZpbGw9IiMxRTFFMUUiLz4KPC9nPgo8L3N2Zz4K\");\n\t\twidth: 42px;\n\t\theight: 42px;\n\t\tmargin-right: 4px;\n\t}\n\n\t&--jetpack-logo {\n\t\tbackground-image: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE2IDMyQzI0LjgzNjYgMzIgMzIgMjQuODM2NiAzMiAxNkMzMiA3LjE2MzQ0IDI0LjgzNjYgMCAxNiAwQzcuMTYzNDQgMCAwIDcuMTYzNDQgMCAxNkMwIDI0LjgzNjYgNy4xNjM0NCAzMiAxNiAzMloiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0xNi43OTM5IDEzLjMxMjVWMjguODI0TDI0Ljc5MzkgMTMuMzEyNUgxNi43OTM5WiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZD0iTTE1LjE3NTUgMTguNjU2N1YzLjE3NTc4TDcuMjA2MDUgMTguNjU2N0gxNS4xNzU1WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg==\");\n\t\twidth: 32px;\n\t\theight: 32px;\n\t\tmargin-left: 11px;\n\t}\n\n\t&--btn-connect-user {\n\t\theight: 40px;\n\t\tfont-size: var( --font-body-small );\n\t\tborder-radius: 4px;\n\t\tbackground: var( --jp-black ) !important;\n\t}\n\n\t&--avatar {\n\t\tborder: 0;\n\t\tborder-radius: 20px;\n\t\twidth: 32px;\n\t\theight: 32px;\n\t\tbackground-color: var( --jp-white );\n\t\tbackground-repeat: no-repeat;\n\t\tbackground-size: contain;\n\t\tmargin-left: -10px;\n\t\tbackground-image: url(\"data:image/svg+xml,%3Csvg width='32' height='32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='16' cy='16' r='16' fill='%23fff'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.498 27.123C6.038 24.165 10.916 21.5 16 21.5c5.084 0 9.963 2.665 11.502 5.623a15.952 15.952 0 01-11.257 4.875L16 32l-.245-.002a15.952 15.952 0 01-11.257-4.875zM16 8a6 6 0 110 12 6 6 0 010-12z' fill='%23A2AAB2'/%3E%3C/svg%3E%0A\");\n\t}\n\n\t&--line {\n\t\twidth: 67px;\n\t\theight: 0;\n\t\tborder-top: 2px solid var( --jp-black );\n\n\t\t&.jp-connection-status-card--site-only {\n\t\t\tborder-top-style: dashed;\n\t\t}\n\t}\n\n\t&--list {\n\t\tmargin: 16px 0;\n\n\t\tlist-style-type: none;\n\n\t\tli {\n\t\t\tpadding-left: 25px;\n\t\t\tcolor: var( --jp-black );\n\t\t\tmargin: 0 0 8px -3px;\n\t\t}\n\n\t\t&-item-success {\n\t\t\tbackground: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE4LjkzNDggNi4wMDAwM0wxMC4wMzQyIDE3Ljk3MDNMNC44NzMxIDE0LjEzMjgiIHN0cm9rZT0iIzFFMUUxRSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPC9zdmc+Cg==\") no-repeat 0 0;\n\t\t}\n\n\t\t&-item-error {\n\t\t\tcolor: var( --jp-red ) !important;\n\t\t\tbackground: url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDIwQzE2LjQxODMgMjAgMjAgMTYuNDE4MyAyMCAxMkMyMCA3LjU4MTcyIDE2LjQxODMgNCAxMiA0QzcuNTgxNzIgNCA0IDcuNTgxNzIgNCAxMkM0IDE2LjQxODMgNy41ODE3MiAyMCAxMiAyMFoiIHN0cm9rZT0iI0Q2MzYzOSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz4KPHBhdGggZD0iTTEzIDdIMTFWMTNIMTNWN1oiIGZpbGw9IiNENjM2MzkiLz4KPHBhdGggZD0iTTEzIDE1SDExVjE3SDEzVjE1WiIgZmlsbD0iI0Q2MzYzOSIvPgo8L3N2Zz4K\") no-repeat 0 0;\n\t\t}\n\t}\n}\n","/********* RNA styles *********/\n// We should extract this into a package\n\n:root {\n\t--font-title-large: 36px;\n\t--font-title-small: 24px;\n\t--font-body: 16px;\n\t--font-label: 12px;\n\t\n\t--jp-black: #000000;\n\t--jp-black-80: #2C3338;\n\t--jp-white: #FFFFFF;\n\t--jp-white-off: #F9F9F6;\n\t--jp-gray: #DCDCDE;\n\t--jp-gray-off: #E2E2DF;\n\t--jp-red: #D63639;\n\n\t--jp-green-primary: #069E08;\n\t--jp-green-secondary: #2FB41F;\n\n\t--jp-border-radius: 4px;\n\t--jp-menu-border-height: 1px;\n\t--jp-underline-thickness: 2px;\n}\n\n/********* Mixins *********/\n@mixin for-phone-up {\n\t@media (min-width: 600px) { @content; }\n}\n@mixin for-tablet-up {\n\t@media (min-width: 960px) { @content; }\n}\n\n@mixin for-phone-down {\n\t@media (max-width: 600px) { @content; }\n}\n@mixin for-tablet-down {\n\t@media (max-width: 960px) { @content; }\n}\n\n/********* Generic styles *********/\n$wp-gray-dark: #23282D;\n\n* {\n\tbox-sizing: border-box;\n}\n\nbody {\n\tmin-height: 100%;\n\tmargin: 0;\n\tpadding: 0;\n\tfont-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen-Sans\", \"Ubuntu\", \"Cantarell\", \"Helvetica Neue\", sans-serif;\n}\n.jp-wrap {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-wrap: wrap;\n\tmax-width: 1128px;\n\tmargin: 0 auto;\n}\n\n.jp-row {\n\tdisplay: grid;\n\tgrid-gap: 24px;\n\tgrid-template-columns: repeat(4, 1fr);\n\twidth: 100%;\n\tmargin: 0 16px;\n\t\n\t@include for-phone-up {\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tmargin: 0 18px;\n\t}\n\t\n\t@include for-tablet-up {\n\t\tgrid-template-columns: repeat(12, 1fr);\n\t\tmax-width: 1128px;\n\t\tmargin: 0 24px;\n\t}\n}\n\n@for $i from 1 through 4 {\n\t.sm-col-span-#{$i} {\n\t\tgrid-column-end: span #{$i};\n\t}\n}\n\n@include for-phone-up {\n\t@for $i from 1 through 8 {\n\t\t.md-col-span-#{$i} {\n\t\t\tgrid-column-end: span #{$i};\n\t\t}\n\t}\n}\n\n@include for-tablet-up {\n\t@for $i from 1 through 12 {\n\t\t.lg-col-span-#{$i} {\n\t\t\tgrid-column-end: span #{$i};\n\t\t}\n\t}\n}\n\n@include for-tablet-down {\n\t.md-col-span-0 {\n\t\tdisplay: none;\n\t}\n}\n\n@include for-phone-down {\n\t.sm-col-span-0 {\n\t\tdisplay: none;\n\t}\n}\n\n.jp-wrap {\n\tdisplay: flex;\n\talign-items: center;\n\tflex-wrap: wrap;\n\tmax-width: 1128px;\n\tmargin: 0 auto;\n}\n\n.jp-row {\n\tdisplay: grid;\n\tgrid-gap: 24px;\n\tgrid-template-columns: repeat(4, 1fr);\n\twidth: 100%;\n\tmargin: 0 16px;\n\t\n\t@include for-phone-up {\n\t\tgrid-template-columns: repeat(8, 1fr);\n\t\tmargin: 0 18px;\n\t}\n\t\n\t@include for-tablet-up {\n\t\tgrid-template-columns: repeat(12, 1fr);\n\t\tmax-width: 1128px;\n\t\tmargin: 0 24px;\n\t}\n}\n\n.jp-cut {\n\tposition: relative;\n\tdisplay: block;\n\tmargin: 32px 0;\n\tpadding: 16px 64px 16px 24px;\n\tborder: 2px solid var( --jp-green-primary );\n\tborder-radius: var( --jp-border-radius );\n\ttext-decoration: none;\n\n\tspan {\n\t\tdisplay: block;\n\n\t\t&:last-of-type {\n\t\t\tfont-weight: 600;\n\t\t}\n\t}\n\n\t&:hover,\n\t&:focus {\n\t\t//box-shadow: 0px 0px 40px rgba( 0, 0, 0, 0.08 );\n\n\t\tspan:last-of-type {\n\t\t\ttext-decoration: underline;\n\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t}\n\n\t\t&:after {\n\t\t\ttransform: translateY( -50% ) translateX( 8px );\n\t\t}\n\t}\n\n\t&:after {\n\t\tcontent: \"→\";\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\tright: 24px;\n\t\tfont-size: 24px;\n\t\tfont-weight: 600;\n\t\tcolor: var( --jp-green-primary );\n\t\ttransform: translateY( -50% );\n\t\ttransition: transform 0.15s ease-out;\n\t}\n}\n","@import '../rna-styles';\n\n.jp-disconnect-dialog {\n\th1 {\n\t\tmargin-top: 0;\n\t\tline-height: 1.2;\n\t\tfont-size: var( --font-title-large );\n\t\tfont-weight: 600;\n\t}\n\n\th2 {\n\t\tmargin: 0;\n\t\tline-height: 1.2;\n\t\tfont-size: var( --font-title-small );\n\t\tfont-weight: 400;\n\t}\n\n\tp {\n\t\tfont-size: var( --font-body );\n\t}\n\n\t&__link{\n\t\tfont-size: var( --font-body );\n\t\tcolor: var( --jp-black );\n\t\ttext-decoration: underline;\n\t\theight: auto;\n\t\tfont: inherit;\n\t\tpadding: 0;\n\n\t\t&:hover {\n\t\t\tcolor: var( --jp-black );\n\t\t\ttext-decoration-thickness: var( --jp-underline-thickness );\n\t\t}\n\n\t\t&:focus {\n\t\t\tcolor: var( --jp-black );\n\t\t\tbox-shadow: none !important;\n\t\t}\n\t}\n\n\t.components-button{\n\t\theight: 40px;\n\t\tfont-size: var( --font-body-small );\n\t\tborder-radius: 4px;\n\t}\n\n\t.components-modal{\n\t\t&__content{\n\t\t\tpadding: 0;\n\t\t}\n\n\t\t&__header{\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\t.jp-row {\n\t\talign-items: center;\n\t}\n\n\t&__content{\n\t\tbackground: var( --jp-white-off );\n\t\tmargin: 0;\n\t\tpadding: 80px;\n\t\tborder-radius: 4px;\n\t\ttext-align: center;\n\t}\n\n\t&__actions{\n\t\tbackground: var( --jp-white );\n\t\tpadding: 10px 48px;\n\t}\n\n\t&__btn-dismiss{\n\t\tbackground: var( --jp-black ) !important;\n\t\tmargin-right: 10px;\n\t}\n\n\t&__btn-disconnect{\n\t\tbackground: var( --jp-red ) !important;\n\t}\n\n\t&__btn-back-to-wp{\n\t\tbackground: var( --jp-black ) !important;\n\t}\n\n\t&__button-wrap{\n\t\ttext-align: center;\n\t}\n\n\t&__error{\n\t\tcolor: var( --jp-red );\n\t}\n\n\t&__success{\n\n\t\t.components-modal{\n\n\t\t\t&__content {\n\t\t\t\tbackground: var( --jp-white );\n\t\t\t\tpadding: 50px;\n\t\t\t}\n\t\t}\n\n\t\th1 {\n\t\t\tmargin-top: 20px;\n\t\t}\n\t}\n}\n\n\n@media (min-width: 960px){\n\t.jp-disconnect-dialog{\n\t\tmin-width: 900px;\n\t\t\n\t\t&__success{\n\t\t\tmin-width: auto;\n\t\t}\n\t}\n\n\t.jp-row {\n\t\tmargin-left: 0px;\n\t}\n}\n"],"names":[],"sourceRoot":""} \ No newline at end of file diff --git a/package.json b/package.json index 0213647..af57461 100644 --- a/package.json +++ b/package.json @@ -15,9 +15,9 @@ }, "dependencies": { "@automattic/jetpack-api": "workspace:^0.5.0", - "@automattic/jetpack-connection": "workspace:^0.9.1", - "@automattic/jetpack-idc": "workspace:^0.4.2", - "@wordpress/data": "6.1.2" + "@automattic/jetpack-connection": "workspace:^0.9.2-alpha", + "@automattic/jetpack-idc": "workspace:^0.4.3-alpha", + "@wordpress/data": "6.1.3" }, "devDependencies": { "@automattic/jetpack-webpack-config": "workspace:^0.1.1-alpha",