@ima/devtools/dist/css/popup.css

IMA.js debugging panel in the Chrome Developer Tools window.

:root {
  --font-family-monospace: 'SFMono-Regular', consolas, 'Liberation Mono',
      menlo, courier, monospace;
  --font-family-sans: -apple-system, blinkmacsystemfont, segoe ui, helvetica,
      arial, sans-serif, apple color emoji, segoe ui emoji, segoe ui symbol;
  --z-index-search-toolbar: 1;
  --z-index-popup-header: 1;
  --z-index-tooltip: 1;
  --z-index-menu-dropdown: 10;
  --z-index-menu-alerts: 100;
  --z-index-modal: 99;
  --color-primary: #f1404b;
  --color-secondary: var(--oc-blue-4);
  --color-text-primary: var(--oc-gray-8);
  --color-text-muted: var(--oc-gray-6);
  --color-border: var(--oc-gray-2);
  --color-black: #000;
  --color-white: #fff;
  --color-button-background: #fff;
  --color-button-background-focus: var(--oc-gray-2);
  --color-button: var(--oc-gray-7);
  --color-button-disabled: var(--oc-gray-4);
  --color-button-active: var(--color-secondary);
  --color-button-focus: var(--oc-gray-8);
  --color-button-hover: var(--oc-gray-6);
  --toolbar-height: 42px;
  --tabs-height: 30px;
  --options-sidebar-width: 300px;
  --oc-gray-0: #f8f9fa;
  --oc-gray-1: #f1f3f5;
  --oc-gray-2: #e9ecef;
  --oc-gray-3: #dee2e6;
  --oc-gray-4: #ced4da;
  --oc-gray-5: #adb5bd;
  --oc-gray-6: #868e96;
  --oc-gray-7: #495057;
  --oc-gray-8: #343a40;
  --oc-gray-9: #212529;
  --oc-red-0: #fff5f5;
  --oc-red-1: #ffe3e3;
  --oc-red-2: #ffc9c9;
  --oc-red-3: #ffa8a8;
  --oc-red-4: #ff8787;
  --oc-red-5: #ff6b6b;
  --oc-red-6: #fa5252;
  --oc-red-7: #f03e3e;
  --oc-red-8: #e03131;
  --oc-red-9: #c92a2a;
  --oc-pink-0: #fff0f6;
  --oc-pink-1: #ffdeeb;
  --oc-pink-2: #fcc2d7;
  --oc-pink-3: #faa2c1;
  --oc-pink-4: #f783ac;
  --oc-pink-5: #f06595;
  --oc-pink-6: #e64980;
  --oc-pink-7: #d6336c;
  --oc-pink-8: #c2255c;
  --oc-pink-9: #a61e4d;
  --oc-grape-0: #f8f0fc;
  --oc-grape-1: #f3d9fa;
  --oc-grape-2: #eebefa;
  --oc-grape-3: #e599f7;
  --oc-grape-4: #da77f2;
  --oc-grape-5: #cc5de8;
  --oc-grape-6: #be4bdb;
  --oc-grape-7: #ae3ec9;
  --oc-grape-8: #9c36b5;
  --oc-grape-9: #862e9c;
  --oc-violet-0: #f3f0ff;
  --oc-violet-1: #e5dbff;
  --oc-violet-2: #d0bfff;
  --oc-violet-3: #b197fc;
  --oc-violet-4: #9775fa;
  --oc-violet-5: #845ef7;
  --oc-violet-6: #7950f2;
  --oc-violet-7: #7048e8;
  --oc-violet-8: #6741d9;
  --oc-violet-9: #5f3dc4;
  --oc-indigo-0: #edf2ff;
  --oc-indigo-1: #dbe4ff;
  --oc-indigo-2: #bac8ff;
  --oc-indigo-3: #91a7ff;
  --oc-indigo-4: #748ffc;
  --oc-indigo-5: #5c7cfa;
  --oc-indigo-6: #4c6ef5;
  --oc-indigo-7: #4263eb;
  --oc-indigo-8: #3b5bdb;
  --oc-indigo-9: #364fc7;
  --oc-blue-0: #e7f5ff;
  --oc-blue-1: #d0ebff;
  --oc-blue-2: #a5d8ff;
  --oc-blue-3: #74c0fc;
  --oc-blue-4: #4dabf7;
  --oc-blue-5: #339af0;
  --oc-blue-6: #228be6;
  --oc-blue-7: #1c7ed6;
  --oc-blue-8: #1971c2;
  --oc-blue-9: #1864ab;
  --oc-cyan-0: #e3fafc;
  --oc-cyan-1: #c5f6fa;
  --oc-cyan-2: #99e9f2;
  --oc-cyan-3: #66d9e8;
  --oc-cyan-4: #3bc9db;
  --oc-cyan-5: #22b8cf;
  --oc-cyan-6: #15aabf;
  --oc-cyan-7: #1098ad;
  --oc-cyan-8: #0c8599;
  --oc-cyan-9: #0b7285;
  --oc-teal-0: #e6fcf5;
  --oc-teal-1: #c3fae8;
  --oc-teal-2: #96f2d7;
  --oc-teal-3: #63e6be;
  --oc-teal-4: #38d9a9;
  --oc-teal-5: #20c997;
  --oc-teal-6: #12b886;
  --oc-teal-7: #0ca678;
  --oc-teal-8: #099268;
  --oc-teal-9: #087f5b;
  --oc-green-0: #ebfbee;
  --oc-green-1: #d3f9d8;
  --oc-green-2: #b2f2bb;
  --oc-green-3: #8ce99a;
  --oc-green-4: #69db7c;
  --oc-green-5: #51cf66;
  --oc-green-6: #40c057;
  --oc-green-7: #37b24d;
  --oc-green-8: #2f9e44;
  --oc-green-9: #2b8a3e;
  --oc-lime-0: #f4fce3;
  --oc-lime-1: #e9fac8;
  --oc-lime-2: #d8f5a2;
  --oc-lime-3: #c0eb75;
  --oc-lime-4: #a9e34b;
  --oc-lime-5: #94d82d;
  --oc-lime-6: #82c91e;
  --oc-lime-7: #74b816;
  --oc-lime-8: #66a80f;
  --oc-lime-9: #5c940d;
  --oc-yellow-0: #fff9db;
  --oc-yellow-1: #fff3bf;
  --oc-yellow-2: #ffec99;
  --oc-yellow-3: #ffe066;
  --oc-yellow-4: #ffd43b;
  --oc-yellow-5: #fcc419;
  --oc-yellow-6: #fab005;
  --oc-yellow-7: #f59f00;
  --oc-yellow-8: #f08c00;
  --oc-yellow-9: #e67700;
  --oc-orange-0: #fff4e6;
  --oc-orange-1: #ffe8cc;
  --oc-orange-2: #ffd8a8;
  --oc-orange-3: #ffc078;
  --oc-orange-4: #ffa94d;
  --oc-orange-5: #ff922b;
  --oc-orange-6: #fd7e14;
  --oc-orange-7: #f76707;
  --oc-orange-8: #e8590c;
  --oc-orange-9: #d9480f;
}
html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  font: 14px/1.4 var(--font-family-sans);
  color: var(--color-text-primary);
}
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-font-smoothing: auto;
}
p {
  margin: 7px 0;
}
.list {
  margin-top: -5px;
  margin-bottom: 7px;
  padding-left: 25px;
  font-size: 12px;
  line-height: 1.7;
  color: var(--oc-gray-7);
}
code {
  border-radius: 3px;
  padding: 2px 6px;
  font-family: var(--font-family-monospace);
  font-size: 12px;
  color: var(--color-primary);
  background: var(--oc-gray-2);
}
.popup {
  width: 350px;
}
.popup__header {
  display: -ms-flexbox;
  display: flex;
  position: relative;
  z-index: var(--z-index-popup-header);
  padding: 5px 15px;
  height: 48px;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center;
  color: var(--oc-gray-8);
  background: var(--color-white);
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.popup__header-title {
  font-weight: bold;
}
.popup__body {
  margin-top: -132px;
  padding: 6px 15px;
  background: var(--oc-gray-0);
}
.popup__body.active {
  margin-top: 0;
}
.ima-js {
  display: inline-block;
  padding-left: 24px;
  width: 24px;
  height: 24px;
  background: url(../media/icon-alive-48.5fe7a0f82c2f9767e1fd.png) no-repeat center top;
  background-size: 18px 18px;
}
.switch input[type='checkbox'] {
  display: none;
  visibility: hidden;
}
.switch .switcher {
  display: inline-block;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 100px;
  width: 40px;
  height: 22px;
  vertical-align: middle;
  background-color: var(--oc-gray-3);
  cursor: pointer;
}
.switch .switcher::before {
  display: block;
  position: absolute;
  left: 2px;
  top: 2px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-top: 0;
  margin-left: 0;
  border-radius: 50%;
  width: 18px;
  height: 18px;
  content: '';
  background-color: var(--color-white);
}
.switch input[type='checkbox']:checked + .switcher {
  background-color: var(--color-white);
  -webkit-box-shadow: 0 0 0 20px var(--oc-green-4) inset;
          box-shadow: 0 0 0 20px var(--oc-green-4) inset;
}
.switch input[type='checkbox']:checked + .switcher::before {
  right: 100%;
  margin-left: 18px;
  background-color: var(--color-white);
}
.switch [disabled]:not([disabled='false']) + .switcher {
  -webkit-transition: none;
  transition: none;
}
.switch [disabled]:not([disabled='false']) + .switcher:active::before {
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
}
.switch [disabled]:not([disabled='false']) + .switcher::before {
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
  -webkit-transition: none;
  transition: none;
}


/*# sourceMappingURL=popup.css.map*/