4911 lines
117 KiB
CSS
4911 lines
117 KiB
CSS
@charset "UTF-8";
|
|
/**
|
|
*
|
|
* Prefix everything
|
|
* Name descriptively
|
|
* Structure radically
|
|
*
|
|
* CSS Structure
|
|
* css/
|
|
* ├─ admin/
|
|
* │ ├─ base.scss
|
|
* │ ├─ layout.scss
|
|
* │ ├─ modules/
|
|
* │ │ ├─ modal.scss
|
|
* │ │ ├─ button.scss
|
|
* │ │ ├─ modal.scss
|
|
* │ │ ├─ notices.scss
|
|
* │ │ ├─ tips-and-tricks.scss
|
|
* │ │ ├─ etc.....
|
|
* │ ├─ states.scss
|
|
* │ ├─ theme.scss
|
|
* ├─ admin.scss
|
|
* ├─ admin.min.css
|
|
* ├─ admin.css
|
|
* ├─ variables.scss
|
|
*
|
|
*/
|
|
:root {
|
|
--rsp-spacing-xxs: 5px;
|
|
--rsp-spacing-xs: 10px;
|
|
--rsp-spacing-s: 15px;
|
|
--rsp-spacing-m: 20px;
|
|
--rsp-spacing-l: 25px;
|
|
--rsp-spacing-xl: 30px;
|
|
--rsp-grid-margin: var(--rsp-spacing-s);
|
|
--rsp-grid-gap: var(--rsp-spacing-m);
|
|
--rsp-border-radius: 12px;
|
|
--rsp-border-radius-s: 8px;
|
|
--rsp-border-radius-xs: 5px;
|
|
--rsp-border-radius-input: var(--rsp-border-radius-xs);
|
|
--rsp-border: 1px solid var(--rsp-border-color);
|
|
--rsp-box-shadow: rgba(0, 0, 0, 0.1) 0 4px 6px -1px, rgba(0, 0, 0, 0.06) 0 2px 4px -1px;
|
|
--rsp-border-color: #dfdfdf;
|
|
--rsp-black: #333;
|
|
--rsp-white: #fff;
|
|
--rsp-yellow: #f4bf3e;
|
|
--rsp-blue: #009fff;
|
|
--rsp-dark-blue: #1E73BE;
|
|
--rsp-green: #2e8a37;
|
|
--rsp-red: #D7263D;
|
|
--rsp-pink: #E35899;
|
|
--rsp-orange: #f39c12;
|
|
--rsp-wp-blue: #007cba;
|
|
--rsp-yellow-faded: #fdf4df;
|
|
--rsp-blue-faded: #E7F1F9;
|
|
--rsp-green-faded: #ecf4ed;
|
|
--rsp-red-faded: #fbebed;
|
|
--rsp-pink-faded: #fceff5;
|
|
--rsp-orange-faded: #fef5ea;
|
|
--rsp-wp-blue-faded: #c6e0ef;
|
|
--rsp-background-block-color: var(--rsp-white);
|
|
--rsp-background-color: #f0f0f1;
|
|
--rsp-input-background-color: #fff;
|
|
--rsp-input-text-color: var(--rsp-text-color);
|
|
--rsp-input-border-color: var(--rsp-grey-400);
|
|
--rsp-text-color: rgba(15, 23, 42, 0.95);
|
|
--rsp-text-color-invert: rgba(255, 255, 255, 0.95);
|
|
--rsp-text-color-white: rgba(255, 255, 255, 0.95);
|
|
--rsp-text-color-light: rgba(15, 23, 42, 0.85);
|
|
--rsp-grey-100: #fafafa;
|
|
--rsp-grey-200: #f7f7f7;
|
|
--rsp-grey-300: #ededed;
|
|
--rsp-grey-400: #c6c6c6;
|
|
--rsp-grey-500: #737373;
|
|
--rsp-grey-600: #696969;
|
|
--rsp-color-success: var(--rsp-green);
|
|
--rsp-color-error: var(--rsp-red);
|
|
--rsp-color-warning: var(--rsp-yellow);
|
|
--rsp-color-open: var(--rsp-yellow);
|
|
--rsp-color-disabled: var(--rsp-grey-300);
|
|
--rsp-fs-90: 0.5625rem;
|
|
--rsp-fs-100: 0.6875rem;
|
|
--rsp-fs-200: 0.75rem;
|
|
--rsp-fs-300: 0.8125rem;
|
|
--rsp-fs-400: 0.875rem;
|
|
--rsp-fs-500: 1rem;
|
|
--rsp-fs-600: 1.125rem;
|
|
--rsp-fs-700: 1.25rem;
|
|
--rsp-fs-800: 1.5rem;
|
|
--rsp-fs-900: 3.5rem;
|
|
--rsp-filter-padding: 6px;
|
|
}
|
|
|
|
@keyframes fade-in {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.cmplz {
|
|
font-variant-numeric: tabular-nums;
|
|
margin: 0;
|
|
margin-left: -20px;
|
|
font-size: var(--rsp-fs-300);
|
|
box-sizing: border-box;
|
|
color: var(--rsp-text-color);
|
|
font-weight: 400;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
@media only screen and (max-width: 768px) {
|
|
.cmplz {
|
|
margin-left: -9px;
|
|
}
|
|
}
|
|
|
|
.cmplz *, .cmplz *:before, .cmplz *:after {
|
|
box-sizing: inherit;
|
|
}
|
|
|
|
.cmplz body, .cmplz h1, .cmplz h2, .cmplz h3, .cmplz h4, .cmplz h5, .cmplz h6, .cmplz p, .cmplz ol, .cmplz ul {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.cmplz img {
|
|
max-width: 100%;
|
|
height: auto;
|
|
}
|
|
|
|
.cmplz h1, .cmplz h2, .cmplz h3, .cmplz h4, .cmplz h5, .cmplz h6 {
|
|
color: var(--rsp-text-color);
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.cmplz .cmplz-h0 {
|
|
font-size: var(--rsp-fs-900);
|
|
font-weight: 700;
|
|
letter-spacing: 0.025rem;
|
|
}
|
|
|
|
.cmplz h1, .cmplz .cmplz-h1 {
|
|
font-size: var(--rsp-fs-800);
|
|
line-height: 1.5;
|
|
font-weight: 500;
|
|
letter-spacing: 0.025rem;
|
|
}
|
|
|
|
.cmplz h2, .cmplz .cmplz-h2 {
|
|
font-size: var(--rsp-fs-700);
|
|
font-weight: 700;
|
|
letter-spacing: 0.025rem;
|
|
}
|
|
|
|
.cmplz h3, .cmplz .cmplz-h3 {
|
|
font-size: var(--rsp-fs-600);
|
|
font-weight: 600;
|
|
letter-spacing: 0.0125rem;
|
|
}
|
|
|
|
.cmplz h4, .cmplz .cmplz-h4 {
|
|
font-size: var(--rsp-fs-500);
|
|
font-weight: 600;
|
|
letter-spacing: 0.0125rem;
|
|
}
|
|
|
|
.cmplz h5, .cmplz .cmplz-h5 {
|
|
font-size: var(--rsp-fs-400);
|
|
font-weight: 500;
|
|
letter-spacing: 0.1px;
|
|
}
|
|
|
|
.cmplz h6, .cmplz .cmplz-h6 {
|
|
font-size: var(--rsp-fs-300);
|
|
letter-spacing: 0.1px;
|
|
}
|
|
|
|
.cmplz p {
|
|
color: var(--rsp-text-color);
|
|
font-weight: 400;
|
|
font-size: var(--rsp-fs-300);
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.cmplz .cmplz-small-text {
|
|
font-size: var(--rsp-fs-200);
|
|
line-height: 1.5;
|
|
color: var(--rsp-text-color-light);
|
|
}
|
|
|
|
.cmplz a {
|
|
font-size: var(--rsp-fs-300);
|
|
}
|
|
|
|
.cmplz .cmplz-notice-hook-element {
|
|
display: none !important;
|
|
}
|
|
|
|
.error:not(.really-simple-plugins), .notice:not(.really-simple-plugins), .update-nag:not(.really-simple-plugins), .notice-info:not(.really-simple-plugins) {
|
|
display: none !important;
|
|
}
|
|
|
|
.error.really-simple-plugins, .notice.really-simple-plugins, .update-nag.really-simple-plugins, .notice-info.really-simple-plugins {
|
|
margin: var(--rsp-grid-gap);
|
|
}
|
|
|
|
.cmplz .cmplz-grid, .cmplz .cmplz-settings-header {
|
|
max-width: clamp(300px, 100% - var(--rsp-grid-gap) * 2, 1600px);
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.cmplz .cmplz-header-container {
|
|
background: var(--rsp-background-block-color);
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
min-height: 70px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header img {
|
|
margin: auto 0;
|
|
height: 26px;
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header .cmplz-header-left {
|
|
display: flex;
|
|
font-size: var(--rsp-fs-400);
|
|
}
|
|
|
|
@media (max-width: 1080px) {
|
|
.cmplz .cmplz-settings-header .cmplz-header-left {
|
|
justify-content: center;
|
|
margin: var(--rsp-spacing-xs) 0;
|
|
order: 3;
|
|
width: 100%;
|
|
background-color: var(--rsp-background-block-color);
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header .cmplz-header-left .cmplz-header-menu {
|
|
margin: auto 15px;
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header .cmplz-header-left .cmplz-header-menu ul {
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header .cmplz-header-left .cmplz-header-menu li {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header .cmplz-header-left .cmplz-header-menu a {
|
|
padding: 23px 15px;
|
|
text-decoration: none;
|
|
color: var(--rsp-text-color);
|
|
height: 100%;
|
|
border-bottom: 4px solid transparent;
|
|
transition: border 0.3s ease-out;
|
|
box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
}
|
|
|
|
@media (max-width: 1080px) {
|
|
.cmplz .cmplz-settings-header .cmplz-header-left .cmplz-header-menu a {
|
|
padding: 10px 15px;
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header .cmplz-header-left .cmplz-header-menu a:focus {
|
|
outline: none;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header .cmplz-header-left .cmplz-header-menu a.active {
|
|
border-bottom: 4px solid var(--rsp-brand-primary);
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header .cmplz-header-left .cmplz-header-menu a:hover {
|
|
color: var(--rsp-brand-primary);
|
|
}
|
|
|
|
.cmplz .cmplz-settings-header .cmplz-header-right {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
margin-left: auto;
|
|
gap: var(--rsp-spacing-s);
|
|
min-height: 52px;
|
|
}
|
|
|
|
.cmplz .cmplz-grid.cmplz-dashboard {
|
|
grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
|
|
}
|
|
|
|
.cmplz .cmplz-grid {
|
|
display: grid;
|
|
gap: var(--rsp-grid-gap);
|
|
grid-template-columns: 28ch 1fr 1fr 1fr;
|
|
margin-top: var(--rsp-grid-gap);
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item {
|
|
background: var(--rsp-background-block-color);
|
|
box-shadow: var(--rsp-box-shadow);
|
|
border-radius: var(--rsp-border-radius);
|
|
transition: all 1s ease;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
flex-direction: column;
|
|
flex-basis: 100%;
|
|
grid-column: span 1;
|
|
grid-row: span 1;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item.cmplz-column-2 {
|
|
grid-column: span 2;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item.cmplz-row-2 {
|
|
grid-row: span 2;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item.cmplz-disabled {
|
|
min-height: 200px;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item.no-background {
|
|
background: none;
|
|
border: none;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item.cmplz-column-2 {
|
|
grid-column: span 2;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item.cmplz-row-2 {
|
|
grid-row: span 2;
|
|
min-height: 400px;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item-header {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
min-height: calc(30px + var(--rsp-spacing-s) * 2);
|
|
padding-inline: var(--rsp-spacing-l);
|
|
}
|
|
|
|
@media screen and (max-width: 1280px) {
|
|
.cmplz .cmplz-grid-item-header {
|
|
padding-inline: var(--rsp-spacing-m);
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.cmplz .cmplz-grid-item-header {
|
|
padding-inline: var(--rsp-spacing-s);
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item-header:empty {
|
|
display: none;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item-title {
|
|
margin: 4px 0 4px 0;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item-controls {
|
|
font-size: var(--rsp-fs-200);
|
|
display: flex;
|
|
gap: var(--rsp-spacing-s);
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item-content {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding-inline: var(--rsp-spacing-l);
|
|
flex-grow: 100;
|
|
}
|
|
|
|
@media screen and (max-width: 1280px) {
|
|
.cmplz .cmplz-grid-item-content {
|
|
padding-inline: var(--rsp-spacing-m);
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.cmplz .cmplz-grid-item-content {
|
|
padding-inline: var(--rsp-spacing-s);
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item-content:empty {
|
|
display: none;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item-footer {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
justify-content: center;
|
|
align-self: flex-end;
|
|
gap: var(--rsp-grid-margin);
|
|
width: 100%;
|
|
min-height: calc(30px + var(--rsp-spacing-s) * 2);
|
|
box-sizing: border-box;
|
|
padding-inline: var(--rsp-spacing-l);
|
|
}
|
|
|
|
@media screen and (max-width: 1280px) {
|
|
.cmplz .cmplz-grid-item-footer {
|
|
padding-inline: var(--rsp-spacing-m);
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.cmplz .cmplz-grid-item-footer {
|
|
padding-inline: var(--rsp-spacing-s);
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item-footer .cmplz-legend {
|
|
display: flex;
|
|
line-height: var(--rsp-fs-100);
|
|
font-size: var(--rsp-fs-100);
|
|
width: max-content;
|
|
color: var(--rsp-text-color-light);
|
|
align-items: center;
|
|
min-width: 0;
|
|
gap: var(--rsp-spacing-xxs);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item-footer:empty {
|
|
display: none;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item .cmplz-flex-push-right {
|
|
margin-left: auto;
|
|
}
|
|
|
|
.cmplz .cmplz-grid-item .cmplz-flex-push-left {
|
|
margin-right: auto;
|
|
}
|
|
|
|
.cmplz-modal-backdrop {
|
|
position: fixed;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
background-color: grey;
|
|
opacity: 0.45;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 15;
|
|
}
|
|
|
|
.cmplz-modal {
|
|
max-width: 526px;
|
|
min-width: 526px;
|
|
position: fixed;
|
|
z-index: 20;
|
|
border-radius: 12px;
|
|
background-color: white;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
margin: 25px;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-header {
|
|
background-color: white;
|
|
padding: 20px 20px 10px 20px;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
border-radius: 12px;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-header .cmplz-modal-header-branding {
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-header .cmplz-modal-header-branding .cmplz-header-logo {
|
|
width: 100%;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-header .modal-title {
|
|
font-size: 20px;
|
|
margin: 0;
|
|
background-color: white;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-header .cmplz-modal-close {
|
|
cursor: pointer;
|
|
background: none;
|
|
border: none;
|
|
font-size: 1.5em;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-header button img {
|
|
height: 16px;
|
|
width: 16px;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-content {
|
|
position: relative;
|
|
padding: 10px 20px 10px 20px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-content .cmplz-modal-subtitle {
|
|
font-weight: 600;
|
|
font-size: 15px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-content .cmplz-modal-description {
|
|
overflow-wrap: anywhere;
|
|
margin-top: 0;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.cmplz-modal .cmplz-modal-footer {
|
|
background: var(--rsp-grey-100);
|
|
padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
|
|
bottom: 0;
|
|
box-shadow: var(--rsp-box-shadow);
|
|
border-radius: 0 0 var(--rsp-border-radius) var(--rsp-border-radius);
|
|
border-top: 1px solid var(--rsp-grey-300);
|
|
box-sizing: border-box;
|
|
display: grid;
|
|
grid-template-columns: auto auto auto 1fr;
|
|
align-items: center;
|
|
gap: var(--rsp-grid-margin);
|
|
width: 100%;
|
|
min-height: 20px;
|
|
}
|
|
|
|
#complianz .cmplz-bullet {
|
|
height: 13px;
|
|
width: 13px;
|
|
flex: 0 0 13px;
|
|
border-radius: 50%;
|
|
display: inline-block;
|
|
background-color: var(--rsp-grey-300);
|
|
}
|
|
|
|
#complianz .cmplz-bullet.rsp-yellow {
|
|
background-color: var(--rsp-yellow);
|
|
}
|
|
|
|
#complianz .cmplz-bullet.rsp-blue {
|
|
background-color: var(--rsp-blue);
|
|
}
|
|
|
|
#complianz .cmplz-bullet.rsp-pink {
|
|
background-color: var(--rsp-pink);
|
|
}
|
|
|
|
#complianz .cmplz-bullet.rsp-red, #complianz .cmplz-bullet.cmplz-bullet-error {
|
|
background-color: var(--rsp-red);
|
|
}
|
|
|
|
#complianz .cmplz-bullet.rsp-green, #complianz .cmplz-bullet.cmplz-bullet-success {
|
|
background-color: var(--rsp-green);
|
|
}
|
|
|
|
#complianz .cmplz-bullet.rsp-blue-yellow {
|
|
background: var(--rsp-blue);
|
|
background: linear-gradient(77deg, rgb(41, 182, 246) 0%, rgb(41, 182, 246) 30%, rgb(244, 191, 62) 70%, rgb(244, 191, 62) 100%);
|
|
animation: gradient 2s ease infinite;
|
|
background-size: 200% 200%;
|
|
}
|
|
|
|
@keyframes gradient {
|
|
0% {
|
|
background-position: 0% 50%;
|
|
}
|
|
|
|
50% {
|
|
background-position: 100% 50%;
|
|
}
|
|
|
|
100% {
|
|
background-position: 0% 50%;
|
|
}
|
|
}
|
|
|
|
.cmplz-icon {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.cmplz-icon svg {
|
|
fill: currentColor;
|
|
}
|
|
|
|
.cmplz-icon-loading svg {
|
|
animation: spin 2s linear infinite;
|
|
}
|
|
|
|
@keyframes spin {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
|
|
100% {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
.cmplz-icon.cmplz-click-animation {
|
|
animation: beat 0.4s ease-out;
|
|
}
|
|
|
|
.cmplz-icon-shortcode {
|
|
cursor: pointer;
|
|
}
|
|
|
|
button.button .cmplz-icon.cmplz-icon-loading {
|
|
padding-top: 6px;
|
|
}
|
|
|
|
button.button .cmplz-icon.cmplz-icon-loading > div {
|
|
line-height: inherit;
|
|
}
|
|
|
|
#complianz .cmplz-modal.cmplz-onboarding .cmplz-header-logo {
|
|
height: 26px;
|
|
}
|
|
|
|
#complianz .cmplz-modal.cmplz-onboarding .cmplz-modal-content {
|
|
padding-top: var(--rsp-spacing-xs);
|
|
line-height: 2.2;
|
|
}
|
|
|
|
#complianz .cmplz-modal.cmplz-onboarding .cmplz-modal-content.cmplz-processing {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
#complianz .cmplz-modal.cmplz-onboarding .cmplz-modal-content .cmplz-onboarding-item {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
#complianz .cmplz-modal.cmplz-onboarding .cmplz-modal-content .cmplz-onboarding-item .cmplz-icon {
|
|
margin-top: 3px;
|
|
margin-right: 7px;
|
|
}
|
|
|
|
#complianz .cmplz-modal.cmplz-onboarding .cmplz-modal-content .cmplz-onboarding-item a {
|
|
margin-top: -2px;
|
|
}
|
|
|
|
#complianz .cmplz-modal.cmplz-onboarding .cmplz-modal-content input[type=email] {
|
|
width: 100%;
|
|
margin-bottom: var(--rsp-spacing-m);
|
|
border: 2px solid;
|
|
height: 50px;
|
|
border-color: var(--rsp-grey-300);
|
|
}
|
|
|
|
#complianz .cmplz-modal.cmplz-onboarding .cmplz-modal-content input[type=email].cmplz-invalid {
|
|
background-color: var(--rsp-red-faded);
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-progress .cmplz-grid-item-content {
|
|
padding: 0;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-progress .cmplz-placeholder {
|
|
padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
|
|
}
|
|
|
|
@media screen and (max-width: 1280px) {
|
|
.cmplz-grid-item.cmplz-progress .cmplz-placeholder {
|
|
padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.cmplz-grid-item.cmplz-progress .cmplz-placeholder {
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
|
|
}
|
|
}
|
|
|
|
.cmplz-progress-block .cmplz-progress, .cmplz-grid-item-footer .cmplz-progress {
|
|
overflow: hidden;
|
|
height: 20px;
|
|
border-radius: 5px;
|
|
background-color: #f7f7f7;
|
|
}
|
|
|
|
.cmplz-progress-block .cmplz-progress .cmplz-bar, .cmplz-grid-item-footer .cmplz-progress .cmplz-bar {
|
|
height: 100%;
|
|
background-color: var(--rsp-color-success);
|
|
}
|
|
|
|
.cmplz-progress-block .cmplz-progress .cmplz-bar.cmplz-orange, .cmplz-grid-item-footer .cmplz-progress .cmplz-bar.cmplz-orange {
|
|
background-color: var(--rsp-color-warning);
|
|
}
|
|
|
|
.cmplz-progress-block .cmplz-progress-bar, .cmplz-grid-item-footer .cmplz-progress-bar {
|
|
padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
|
|
padding-block: 0;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
@media screen and (max-width: 1280px) {
|
|
.cmplz-progress-block .cmplz-progress-bar, .cmplz-grid-item-footer .cmplz-progress-bar {
|
|
padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.cmplz-progress-block .cmplz-progress-bar, .cmplz-grid-item-footer .cmplz-progress-bar {
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
|
|
}
|
|
}
|
|
|
|
.cmplz-progress-block .cmplz-progress-text, .cmplz-grid-item-footer .cmplz-progress-text {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
|
|
padding-block: var(--rsp-spacing-s);
|
|
justify-content: flex-start;
|
|
gap: var(--rsp-spacing-m);
|
|
}
|
|
|
|
@media screen and (max-width: 1280px) {
|
|
.cmplz-progress-block .cmplz-progress-text, .cmplz-grid-item-footer .cmplz-progress-text {
|
|
padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.cmplz-progress-block .cmplz-progress-text, .cmplz-grid-item-footer .cmplz-progress-text {
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
|
|
}
|
|
}
|
|
|
|
.cmplz-progress-block .cmplz-progress-text .cmplz-progress-percentage, .cmplz-grid-item-footer .cmplz-progress-text .cmplz-progress-percentage {
|
|
font-size: var(--rsp-fs-800);
|
|
font-weight: 700;
|
|
}
|
|
|
|
.cmplz-progress-block .cmplz-progress-text .cmplz-progress-text-span, .cmplz-grid-item-footer .cmplz-progress-text .cmplz-progress-text-span {
|
|
font-weight: 500;
|
|
font-size: var(--rsp-fs-600);
|
|
}
|
|
|
|
.cmplz-progress-block .cmplz-progress-text .cmplz-progress-text-span a, .cmplz-grid-item-footer .cmplz-progress-text .cmplz-progress-text-span a {
|
|
margin-left: 3px;
|
|
}
|
|
|
|
@media only screen and (max-width: 1366px) and (min-width: 1280px) {
|
|
.cmplz-progress-block .cmplz-progress-text .cmplz-progress-text-span, .cmplz-grid-item-footer .cmplz-progress-text .cmplz-progress-text-span {
|
|
font-size: var(--rsp-fs-500);
|
|
}
|
|
}
|
|
|
|
.cmplz-header-html {
|
|
display: flex;
|
|
color: var(--rsp-text-color-light);
|
|
}
|
|
|
|
.cmplz-header-html .cmplz-toggle-active {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.cmplz-task-switcher-container {
|
|
display: flex;
|
|
border-radius: var(--rsp-border-radius);
|
|
}
|
|
|
|
.cmplz-task-switcher-container .cmplz-task-switcher:first-of-type {
|
|
border-right: 1px solid var(--rsp-grey-400);
|
|
padding-right: 10px;
|
|
}
|
|
|
|
.cmplz-task-switcher-container .cmplz-task-switcher:last-of-type {
|
|
padding-left: 10px;
|
|
}
|
|
|
|
.cmplz-task-switcher {
|
|
font-size: var(--rsp-fs-200);
|
|
cursor: pointer;
|
|
transition: 0.3s;
|
|
}
|
|
|
|
.cmplz-task-switcher:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.cmplz-active-filter-remaining .cmplz-remaining-tasks, .cmplz-active-filter-all .cmplz-all-tasks {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.cmplz-active-filter-all .cmplz-remaining-tasks, .cmplz-active-filter-remaining .cmplz-all-tasks {
|
|
color: var(--rsp-grey-500);
|
|
}
|
|
|
|
/**
|
|
* Task element, list of tasks
|
|
*/
|
|
.cmplz-task-element {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: center;
|
|
gap: var(--rsp-spacing-m);
|
|
padding-bottom: var(--rsp-spacing-s);
|
|
}
|
|
|
|
@media (max-width: 1280px) {
|
|
.cmplz-task-element {
|
|
gap: var(--rsp-spacing-xs);
|
|
}
|
|
}
|
|
|
|
.cmplz-task-element .cmplz-task-message {
|
|
flex: 1;
|
|
font-size: var(--rsp-fs-300);
|
|
}
|
|
|
|
.cmplz-task-element .cmplz-task-form {
|
|
margin-top: var(--rsp-spacing-xxs);
|
|
display: flex;
|
|
gap: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
.cmplz-task-element .cmplz-task-dismiss:hover {
|
|
transform: scale(1.1);
|
|
}
|
|
|
|
.cmplz-task-element .cmplz-task-dismiss button {
|
|
all: initial;
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
}
|
|
|
|
.cmplz-task-element .cmplz-task-dismiss svg {
|
|
height: 12px;
|
|
width: 12px;
|
|
}
|
|
|
|
.cmplz-scroll-container {
|
|
padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
|
|
height: 230px;
|
|
overflow-y: auto;
|
|
padding-block: 0;
|
|
padding-top: var(--rsp-spacing-xxs);
|
|
border-radius: 0;
|
|
}
|
|
|
|
@media screen and (max-width: 1280px) {
|
|
.cmplz-scroll-container {
|
|
padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.cmplz-scroll-container {
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
|
|
}
|
|
}
|
|
|
|
.cmplz-scroll-container::-webkit-scrollbar-track {
|
|
border-radius: 10px;
|
|
-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0);
|
|
background-color: transparent;
|
|
}
|
|
|
|
.cmplz-scroll-container::-webkit-scrollbar {
|
|
width: 8px;
|
|
border-radius: 10px;
|
|
background-color: var(--rsp-grey-300);
|
|
}
|
|
|
|
.cmplz-scroll-container::-webkit-scrollbar-thumb {
|
|
background-color: var(--rsp-grey-400);
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.cmplz-progress-status-container {
|
|
margin-right: 40px;
|
|
}
|
|
|
|
.cmplz-task-status {
|
|
display: block;
|
|
min-width: 100px;
|
|
text-align: center;
|
|
border-radius: 15px;
|
|
padding: 4px 8px;
|
|
font-size: var(--rsp-fs-100);
|
|
font-weight: 500;
|
|
}
|
|
|
|
@media (max-width: 1280px) {
|
|
.cmplz-task-status {
|
|
min-width: 80px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1080px) {
|
|
.cmplz-task-status {
|
|
aspect-ratio: 1/1;
|
|
min-width: 10px;
|
|
height: 16px;
|
|
border-radius: 100%;
|
|
text-indent: -9999px;
|
|
/* sends the text off-screen */
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
|
|
.cmplz-task-status.cmplz-completed, .cmplz-task-status.cmplz-success {
|
|
background-color: var(--rsp-color-success);
|
|
color: var(--rsp-text-color-white);
|
|
}
|
|
|
|
.cmplz-task-status.cmplz-open {
|
|
background-color: var(--rsp-color-open);
|
|
}
|
|
|
|
.cmplz-task-status.cmplz-urgent {
|
|
background-color: var(--rsp-color-error);
|
|
color: var(--rsp-text-color-white);
|
|
}
|
|
|
|
.cmplz-task-status.cmplz-premium {
|
|
background-color: var(--rsp-blue);
|
|
color: var(--rsp-text-color-white);
|
|
}
|
|
|
|
.cmplz-plusone {
|
|
min-width: 15px;
|
|
height: 18px;
|
|
font-size: var(--rsp-fs-100);
|
|
line-height: initial;
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
box-sizing: border-box;
|
|
margin: 1px 0 0 0;
|
|
padding: 2px 5px;
|
|
border-radius: 50%;
|
|
background-color: #d63638;
|
|
color: #fff;
|
|
text-align: center;
|
|
}
|
|
|
|
@media only screen and (max-width: 1366px) {
|
|
.cmplz-footer-left {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.cmplz-placeholder {
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
text-align: left;
|
|
margin: 0;
|
|
padding-bottom: 24px;
|
|
color: #1e1e1e;
|
|
-webkit-font-smoothing: subpixel-antialiased;
|
|
border-radius: 2px;
|
|
background-color: #fff;
|
|
flex-grow: 100;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line {
|
|
float: left;
|
|
width: 100%;
|
|
height: 16px;
|
|
margin-top: 12px;
|
|
border-radius: 7px;
|
|
background-image: linear-gradient(90deg, #ddd 0, #e8e8e8 40px, #ddd 80px);
|
|
background-size: 600px;
|
|
animation: shine-lines 1.6s infinite linear;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:last-of-type {
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(1) {
|
|
width: 61%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(2) {
|
|
width: 83%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(3) {
|
|
width: 92%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(4) {
|
|
width: 96%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(5) {
|
|
width: 63%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(6) {
|
|
width: 92%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(7) {
|
|
width: 68%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(8) {
|
|
width: 92%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(9) {
|
|
width: 92%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(10) {
|
|
width: 87%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(11) {
|
|
width: 95%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(12) {
|
|
width: 67%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(13) {
|
|
width: 82%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(14) {
|
|
width: 95%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(15) {
|
|
width: 70%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(16) {
|
|
width: 97%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(17) {
|
|
width: 64%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(18) {
|
|
width: 82%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(19) {
|
|
width: 71%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line:nth-of-type(20) {
|
|
width: 74%;
|
|
}
|
|
|
|
.cmplz-placeholder .cmplz-placeholder-line ~ .cmplz-placeholder-line {
|
|
background-color: #ddd;
|
|
}
|
|
|
|
.cmplz-placeholder-count-1 {
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
.cmplz-placeholder-count-1 .cmplz-placeholder-line {
|
|
margin: 0;
|
|
background-image: linear-gradient(90deg, #f9f9f9 0, #f9f9f9 40px, #f9f9f9 80px);
|
|
}
|
|
|
|
.cmplz-placeholder-count-1 .cmplz-placeholder-line:last-of-type {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
@keyframes shine-lines {
|
|
0% {
|
|
background-position: -400px;
|
|
}
|
|
|
|
100% {
|
|
background-position: 220px;
|
|
}
|
|
}
|
|
|
|
.cmplz-page-placeholder .cmplz-grid-item, .cmplz-grid-item-placeholder {
|
|
overflow: hidden;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.cmplz-page-placeholder .cmplz-grid-item:after, .cmplz-grid-item-placeholder:after {
|
|
content: "";
|
|
top: 0;
|
|
overflow: hidden;
|
|
transform: translateX(100%);
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
display: inline-block;
|
|
z-index: 1;
|
|
animation: slide 1s infinite;
|
|
background: linear-gradient(103deg, rgba(228, 229, 232, 0) 25%, rgba(228, 229, 232, 0.35) 50%, rgba(128, 186, 232, 0) 99%, rgba(125, 185, 232, 0) 75%);
|
|
/* W3C */
|
|
}
|
|
|
|
.cmplz-grid-item-placeholder {
|
|
min-height: 300px;
|
|
}
|
|
|
|
/* animation */
|
|
@keyframes slide {
|
|
0% {
|
|
transform: translateX(-100%);
|
|
}
|
|
|
|
100% {
|
|
transform: translateX(100%);
|
|
}
|
|
}
|
|
|
|
.cmplz-loading-container {
|
|
transition: opacity 0.2s ease-in-out, filter 0.2s ease-in-out;
|
|
}
|
|
|
|
.cmplz-loading-container.cmplz-loading {
|
|
opacity: 0.3;
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins .cmplz-placeholder {
|
|
background-color: transparent;
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins .rsp-logo img {
|
|
height: 20px;
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container {
|
|
display: flex !important;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
margin-bottom: 10px;
|
|
font-size: var(--rsp-fs-300);
|
|
line-height: 1.7;
|
|
gap: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
@media screen and (max-width: 992px) {
|
|
#complianz .cmplz-other-plugins-container {
|
|
flex-direction: row;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element {
|
|
width: 100%;
|
|
display: flex;
|
|
align-content: space-between;
|
|
justify-content: space-between;
|
|
gap: 10px;
|
|
--rsp-other-plugins-color: var(---rsp-brand-primary);
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element.cmplz-zip-recipes {
|
|
--rsp-other-plugins-color: var(--rsp-pink);
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element.cmplz-burst-statistics {
|
|
--rsp-other-plugins-color: var(--rsp-green);
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element.cmplz-complianz-gdpr {
|
|
--rsp-other-plugins-color: var(--rsp-blue);
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element.cmplz-complianz-terms-conditions {
|
|
--rsp-other-plugins-color: var(--rsp-black);
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element.cmplz-really-simple-ssl {
|
|
--rsp-other-plugins-color: var(--rsp-yellow);
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element a {
|
|
width: max-content;
|
|
color: var(--rsp-text-color-light);
|
|
transition: color 0.3s ease;
|
|
display: flex;
|
|
align-items: center;
|
|
min-width: 0;
|
|
gap: var(--rsp-spacing-xs);
|
|
text-decoration: none;
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element a:hover {
|
|
color: var(--rsp-other-plugins-color);
|
|
text-decoration: underline;
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element a:hover .cmplz-bullet {
|
|
background-color: var(--rsp-other-plugins-color);
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element a:hover .cmplz-other-plugins-content {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element .cmplz-bullet {
|
|
transition: background-color 0.3s ease;
|
|
background-color: var(--rsp-other-plugins-color);
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element .cmplz-other-plugins-content {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
#complianz .cmplz-other-plugins-container .cmplz-other-plugins-element .cmplz-other-plugin-status {
|
|
min-width: fit-content;
|
|
}
|
|
|
|
.cmplz-tips_tricks .cmplz-grid-item-header .cmplz-grid-item-controls {
|
|
height: 28px;
|
|
}
|
|
|
|
.cmplz-tips-tricks-container {
|
|
display: flex !important;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
margin-bottom: 10px;
|
|
font-size: var(--rsp-fs-300);
|
|
line-height: 1.7;
|
|
gap: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
@media screen and (max-width: 992px) {
|
|
.cmplz-tips-tricks-container {
|
|
flex-direction: row;
|
|
overflow: hidden;
|
|
}
|
|
}
|
|
|
|
.cmplz-tips-tricks-container .cmplz-tips-tricks-element {
|
|
width: calc(50% - var(--rsp-spacing-xxs));
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.cmplz-tips-tricks-container .cmplz-tips-tricks-element {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.cmplz-tips-tricks-container .cmplz-tips-tricks-element a {
|
|
color: var(--rsp-text-color-light);
|
|
transition: color 0.3s ease;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--rsp-spacing-xs);
|
|
min-width: 0;
|
|
/* or some value */
|
|
text-decoration: none;
|
|
}
|
|
|
|
.cmplz-tips-tricks-container .cmplz-tips-tricks-element a:hover {
|
|
color: var(--rsp-brand-primary);
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.cmplz-tips-tricks-container .cmplz-tips-tricks-element a:hover svg path {
|
|
fill: var(--rsp-brand-primary);
|
|
}
|
|
|
|
.cmplz-tips-tricks-container .cmplz-tips-tricks-element a:hover .cmplz-tips-tricks-content {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.cmplz-tips-tricks-container .cmplz-tips-tricks-element .cmplz-bullet {
|
|
transition: background-color 0.3s ease;
|
|
background-color: var(--rsp-grey-300);
|
|
}
|
|
|
|
.cmplz-tips-tricks-container .cmplz-tips-tricks-element .cmplz-tips-tricks-content {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.border-to-border .cmplz-grid-item-content {
|
|
padding: 0;
|
|
}
|
|
|
|
.border-to-border .cmplz-grid-item-content > * {
|
|
padding-inline: var(--rsp-spacing-l);
|
|
width: 100%;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
}
|
|
|
|
.cmplz-hidden {
|
|
display: none;
|
|
}
|
|
|
|
.cmplz-dashboard .cmplz-statistics {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents h3.cmplz-h4 {
|
|
margin-top: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-document-header {
|
|
margin-top: var(--rsp-spacing-l);
|
|
margin-bottom: var(--rsp-spacing-s);
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-document-header > a {
|
|
color: var(--rsp-text-color-light);
|
|
font-size: var(--rsp-fs-300);
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-single-document {
|
|
display: grid;
|
|
grid-template-columns: 2fr auto auto auto;
|
|
grid-gap: var(--rsp-spacing-xs);
|
|
margin: 0;
|
|
padding: 8px var(--rsp-spacing-l);
|
|
align-items: center;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-single-document-title {
|
|
flex: 1;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-single-document .cmplz-tooltip-icon {
|
|
flex: 0;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-single-document-generated {
|
|
margin-left: auto;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-single-document-other-regions {
|
|
display: grid;
|
|
grid-template-columns: 2fr auto auto auto auto auto auto auto;
|
|
margin: var(--rsp-spacing-xs) 0;
|
|
align-items: center;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-single-document-other-regions .cmplz-region-indicator {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-single-document-other-documents {
|
|
display: grid;
|
|
grid-template-columns: 2fr auto auto;
|
|
margin: var(--rsp-spacing-xs) 0;
|
|
align-items: center;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-single-document-other-documents .cmplz-tooltip-icon {
|
|
margin-left: 15px;
|
|
}
|
|
|
|
.cmplz-grid-item.cmplz-documents .cmplz-single-document-other-documents .cmplz-icon-file-download {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.cmplz-tools .cmplz-grid-item-content .cmplz-tool {
|
|
display: flex;
|
|
padding: 8px var(--rsp-spacing-l);
|
|
}
|
|
|
|
.cmplz-tools .cmplz-grid-item-content .cmplz-tool:nth-child(odd) {
|
|
background-color: var(--rsp-grey-200);
|
|
}
|
|
|
|
.cmplz-tools .cmplz-grid-item-content .cmplz-tool .cmplz-plusone {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
.cmplz-tools .cmplz-grid-item-content .cmplz-tool-link {
|
|
margin-left: auto;
|
|
}
|
|
|
|
.cmplz-tools .cmplz-grid-item-content .cmplz-tool-link a {
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz-tools .cmplz-grid-item-content .cmplz-tool-link a .cmplz-icon {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
.cmplz-tools .cmplz-statistics {
|
|
padding-inline: var(--rsp-spacing-l);
|
|
}
|
|
|
|
.cmplz-statistics-select {
|
|
padding-inline: var(--rsp-spacing-l);
|
|
padding-block: var(--rsp-spacing-m);
|
|
display: grid;
|
|
width: 100%;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: var(--rsp-spacing-s);
|
|
background: var(--rsp-green-faded);
|
|
}
|
|
|
|
.cmplz-statistics-select-item {
|
|
border-radius: var(--rsp-border-radius-input);
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
text-align: center;
|
|
padding-block: var(--rsp-spacing-s);
|
|
justify-items: center;
|
|
flex-wrap: wrap;
|
|
background: var(--rsp-white);
|
|
}
|
|
|
|
.cmplz-statistics-select-item.active {
|
|
box-shadow: inset 0 0 3px 2px var(--rsp-green-faded);
|
|
border: 2px solid var(--rsp-green);
|
|
}
|
|
|
|
.cmplz-statistics-select-item h2 {
|
|
margin-top: var(--rsp-spacing-xxs);
|
|
font-weight: 800;
|
|
}
|
|
|
|
.cmplz-statistics-select-item span {
|
|
display: flex;
|
|
gap: 3px;
|
|
justify-content: center;
|
|
font-size: var(--rsp-fs-100);
|
|
}
|
|
|
|
.cmplz-statistics-select-item span .burst-icon-live {
|
|
animation-name: pulse;
|
|
animation-duration: 1.5s;
|
|
animation-timing-function: ease-in;
|
|
animation-direction: alternate;
|
|
animation-iteration-count: infinite;
|
|
animation-play-state: running;
|
|
}
|
|
|
|
@keyframes pulse {
|
|
0% {
|
|
transform: scale(0.9);
|
|
opacity: 0.2;
|
|
}
|
|
|
|
100% {
|
|
transform: scale(1);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.cmplz-statistics-list {
|
|
width: 100%;
|
|
}
|
|
|
|
.cmplz-statistics-list-item {
|
|
width: 100%;
|
|
display: grid;
|
|
justify-items: flex-start;
|
|
grid-template-columns: auto 1fr auto;
|
|
gap: var(--rsp-spacing-s);
|
|
padding-block: var(--rsp-spacing-xs);
|
|
padding-inline: var(--rsp-spacing-l);
|
|
}
|
|
|
|
.cmplz-statistics-list-item:nth-of-type(even) {
|
|
background: var(--rsp-grey-200);
|
|
}
|
|
|
|
.cmplz-statistics-list-item-text {
|
|
width: 100%;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.cmplz-statistics-list-item-number {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.cmplz-confetti {
|
|
position: absolute;
|
|
left: 50%;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-helplink {
|
|
color: var(--rsp-text-color);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-settings-region {
|
|
width: 25px;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item {
|
|
position: relative;
|
|
margin-bottom: var(--rsp-grid-gap);
|
|
}
|
|
|
|
@media (max-width: 1080px) {
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item {
|
|
grid-column: span 4;
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-content {
|
|
animation: cmplz-fade-in 0.2s ease-in;
|
|
}
|
|
|
|
@keyframes cmplz-fade-in {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings > div:nth-last-of-type(2) {
|
|
margin-bottom: 0;
|
|
border-radius: var(--rsp-border-radius) var(--rsp-border-radius) 0 0;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings.cmplz-column-2 {
|
|
grid-column: span 2;
|
|
}
|
|
|
|
@media (max-width: 1080px) {
|
|
.cmplz .cmplz-wizard-settings.cmplz-column-2 {
|
|
grid-column: span 4;
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-locked {
|
|
position: absolute;
|
|
z-index: 10;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
background: rgba(255, 255, 255, 0.8);
|
|
border-radius: var(--rsp-border-radius);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-locked .cmplz-locked-overlay {
|
|
z-index: 1;
|
|
top: calc(100% - 95px);
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--rsp-spacing-s);
|
|
background-color: var(--rsp-white);
|
|
padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
|
|
border-radius: var(--rsp-border-radius-input);
|
|
margin: var(--rsp-spacing-s);
|
|
box-shadow: var(--rsp-box-shadow);
|
|
}
|
|
|
|
@media screen and (max-width: 1280px) {
|
|
.cmplz .cmplz-wizard-settings .cmplz-locked .cmplz-locked-overlay {
|
|
padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.cmplz .cmplz-wizard-settings .cmplz-locked .cmplz-locked-overlay {
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-locked .cmplz-locked-overlay .cmplz-open {
|
|
float: left;
|
|
margin-right: 12px;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-locked .cmplz-locked-overlay .cmplz-progress-status {
|
|
float: left;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer-container {
|
|
position: sticky;
|
|
bottom: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
z-index: 12;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer-scroll-progress-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
height: 3px;
|
|
background-color: var(--rsp-grey-300);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer-scroll-progress {
|
|
height: 100%;
|
|
background-color: var(--rsp-blue);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer {
|
|
background: var(--rsp-grey-100);
|
|
padding: var(--rsp-spacing-m) var(--rsp-spacing-l);
|
|
box-shadow: var(--rsp-box-shadow);
|
|
border-radius: 0 0 var(--rsp-border-radius) var(--rsp-border-radius);
|
|
border-top: 1px solid var(--rsp-grey-300);
|
|
box-sizing: border-box;
|
|
align-items: center;
|
|
gap: var(--rsp-grid-margin);
|
|
width: 100%;
|
|
min-height: 20px;
|
|
justify-content: space-around;
|
|
}
|
|
|
|
@media screen and (max-width: 1280px) {
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer {
|
|
padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 1080px) {
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer {
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
|
|
}
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer > div:last-of-type {
|
|
margin-left: auto;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer-buttons {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
gap: var(--rsp-spacing-s);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer-upsell-bar .button {
|
|
display: inline-block !important;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-settings .cmplz-grid-item-footer:empty {
|
|
display: none;
|
|
}
|
|
|
|
.cmplz-cookiebanner-preview-controls {
|
|
display: flex;
|
|
justify-content: stretch;
|
|
flex-wrap: wrap;
|
|
margin-top: var(--rsp-spacing-l);
|
|
}
|
|
|
|
.cmplz-cookiebanner-preview-controls h6 {
|
|
margin-top: var(--rsp-spacing-s);
|
|
margin-bottom: var(--rsp-spacing-xxs);
|
|
width: 100%;
|
|
}
|
|
|
|
.cmplz-cookiebanner-preview-controls button {
|
|
background: var(--rsp-grey-200);
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
|
|
border-radius: var(--rsp-border-radius-input);
|
|
border: 1px solid var(--rsp-grey-300);
|
|
}
|
|
|
|
.cmplz-cookiebanner-preview-controls button:hover {
|
|
background: var(--rsp-grey-300);
|
|
}
|
|
|
|
.cmplz-cookiebanner-preview-controls button.active {
|
|
background: var(--rsp-blue);
|
|
color: var(--rsp-white);
|
|
border: 1px solid var(--rsp-blue);
|
|
}
|
|
|
|
.cmplz-cookiebanner-preview-controls button.active:hover {
|
|
background: var(--rsp-blue);
|
|
}
|
|
|
|
.cmplz-cookiebanner-preview-controls button.inactive {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.cmplz-cookiebanner-preview-controls-buttons {
|
|
width: 100%;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
gap: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
.cmplz-error-boundary {
|
|
padding: var(--rsp-spacing-l);
|
|
}
|
|
|
|
.cmplz-wizard-help {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-content: flex-start;
|
|
gap: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
.cmplz-wizard-help details {
|
|
font-size: var(--rsp-fs-200);
|
|
}
|
|
|
|
.cmplz-wizard-help details .cmplz-help-more-info {
|
|
display: flex;
|
|
flex-direction: row;
|
|
margin-top: 12px;
|
|
}
|
|
|
|
.cmplz-wizard-help details summary {
|
|
display: grid;
|
|
grid-template-columns: 1fr auto;
|
|
justify-content: space-between;
|
|
font-size: var(--rsp-fs-300);
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.cmplz-wizard-help details summary::-webkit-details-marker {
|
|
display: none;
|
|
}
|
|
|
|
.cmplz-wizard-help details summary:first-of-type {
|
|
list-style-type: none;
|
|
}
|
|
|
|
.cmplz-wizard-help details summary .cmplz-icon {
|
|
transition: all 0.3s ease-in-out;
|
|
transform: rotate(0deg);
|
|
}
|
|
|
|
.cmplz-wizard-help summary, .cmplz-wizard-help p {
|
|
font-size: var(--rsp-fs-200);
|
|
}
|
|
|
|
.cmplz-wizard-help details[open] {
|
|
padding: var(--rsp-spacing-s) var(--rsp-spacing-m);
|
|
}
|
|
|
|
.cmplz-wizard-help details[open] summary {
|
|
padding: 0;
|
|
padding-bottom: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
.cmplz-wizard-help details[open] summary .cmplz-icon {
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
.cmplz-wizard-help .cmplz-help-header {
|
|
width: 100%;
|
|
display: flex;
|
|
padding: 10px;
|
|
}
|
|
|
|
.cmplz-wizard-help .cmplz-help-header .cmplz-help-title {
|
|
font-size: 18px;
|
|
}
|
|
|
|
.cmplz-wizard-help .cmplz-help-header .cmplz-help-control {
|
|
margin-left: auto;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.cmplz-wizard-help-notice {
|
|
width: 100%;
|
|
background: var(--rsp-background-block-color);
|
|
box-shadow: var(--rsp-box-shadow);
|
|
border-radius: var(--rsp-border-radius);
|
|
border-radius: var(--rsp-border-radius-s);
|
|
height: fit-content;
|
|
background-color: var(--rsp-blue-faded);
|
|
}
|
|
|
|
.cmplz-wizard-help-notice.cmplz-warning {
|
|
background-color: var(--rsp-yellow-faded);
|
|
}
|
|
|
|
.cmplz-wizard-help-notice summary, .cmplz-wizard-help-notice p {
|
|
padding: var(--rsp-spacing-s) var(--rsp-spacing-m);
|
|
}
|
|
|
|
.cmplz-borderradius-control {
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz-borderradius-element-label, .cmplz-borderwidth-element-label {
|
|
color: var(--rsp-grey-400);
|
|
font-size: 13px;
|
|
}
|
|
|
|
.cmplz-borderradius input, .cmplz-borderwidth input {
|
|
width: 60px;
|
|
}
|
|
|
|
.cmplz-borderradius-inputtype-pixel, .cmplz-borderwidth-inputtype-pixel {
|
|
margin-top: 13px;
|
|
}
|
|
|
|
.cmplz-borderradius-inputtype-percent, .cmplz-borderradius-inputtype-pixel, .cmplz-borderwidth-inputtype-percent, .cmplz-borderwidth-inputtype-pixel {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.cmplz-borderradius-inputtype-percent.cmplz-inactive, .cmplz-borderradius-inputtype-pixel.cmplz-inactive, .cmplz-borderwidth-inputtype-percent.cmplz-inactive, .cmplz-borderwidth-inputtype-pixel.cmplz-inactive {
|
|
color: var(--rsp-grey-400);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-menu-header {
|
|
min-height: calc(30px + var(--rsp-spacing-s) * 2);
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: var(--rsp-spacing-xs) var(--rsp-spacing-s) 0 var(--rsp-spacing-s);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-menu-item {
|
|
text-decoration: none;
|
|
padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
|
|
color: var(--rsp-text-color);
|
|
display: flex;
|
|
align-items: center;
|
|
border-radius: var(--rsp-border-radius-s);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-menu-item.cmplz-main {
|
|
font-size: var(--rsp-fs-400);
|
|
font-weight: 700;
|
|
color: var(--rsp-text-color);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-menu-item.cmplz-main.cmplz-active {
|
|
color: rgb(46, 134, 199);
|
|
background-color: var(--rsp-blue-faded);
|
|
box-shadow: var(--rsp-box-shadow);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-menu-item[href]:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-menu .cmplz-submenu-items {
|
|
margin: var(--rsp-spacing-xs) 0;
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-menu .cmplz-submenu-items .cmplz-wizard-menu-item {
|
|
gap: var(--rsp-spacing-xs);
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-s);
|
|
color: var(--rsp-text-color-light);
|
|
font-size: var(--rsp-fs-300);
|
|
line-height: var(--rsp-fs-500);
|
|
}
|
|
|
|
.cmplz .cmplz-wizard-menu .cmplz-submenu-items .cmplz-wizard-menu-item.cmplz-active {
|
|
color: rgb(46, 134, 199);
|
|
}
|
|
|
|
#complianz .components-form-file-upload button {
|
|
color: var(--rsp-text-color-light);
|
|
border: 1px solid var(--rsp-input-border-color);
|
|
background: var(--rsp-grey-200);
|
|
padding: 0 var(--rsp-spacing-xs);
|
|
min-height: 30px;
|
|
height: min-content;
|
|
}
|
|
|
|
#complianz input[type=checkbox].indeterminate {
|
|
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><rect x="10" y="45" width="80" height="10" fill="currentColor"/></svg>') no-repeat center center;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-parent-label {
|
|
padding-bottom: var(--rsp-spacing-m);
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-parent-label label {
|
|
font-size: var(--rsp-fs-500);
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-required {
|
|
font-size: var(--rsp-fs-100);
|
|
color: var(--rsp-text-color-light);
|
|
font-weight: 400;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-label-container {
|
|
display: flex;
|
|
gap: 10px;
|
|
font-weight: 600;
|
|
font-size: var(--rsp-fs-300);
|
|
color: var(--rsp-text-color);
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-label-container.cmplz-parent {
|
|
font-size: var(--rsp-fs-500);
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-create-document {
|
|
padding: 10px 0;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-create-document .cmplz-icon {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-create-document input {
|
|
width: 50%;
|
|
min-width: 200px;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .components-flex .components-flex-item label {
|
|
margin: 0;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .components-flex .components-input-control__container {
|
|
max-width: max-content;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .components-base-control__field {
|
|
margin-bottom: 0;
|
|
display: flex;
|
|
flex-flow: column;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz_multicheckbox .components-base-control__field {
|
|
display: block;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-text-control {
|
|
-webkit-box-pack: justify;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-text-control__field {
|
|
display: flex;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .components-toggle-control .components-base-control__field, #complianz div[class^=cmplz-wizard-] .components-toggle-control .components-flex {
|
|
display: flex;
|
|
flex-direction: row-reverse;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .components-toggle-control .components-base-control__field .components-form-toggle, #complianz div[class^=cmplz-wizard-] .components-toggle-control .components-flex .components-form-toggle {
|
|
margin-right: 0;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .components-form-toggle.is-checked .components-form-toggle__track {
|
|
background-color: var(--rsp-green);
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-grid-item .cmplz-grid-item-content {
|
|
margin-block: var(--rsp-spacing-l);
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--rsp-spacing-l);
|
|
padding-inline: 0;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-field-wrap {
|
|
display: flex;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-field-wrap, #complianz div[class^=cmplz-wizard-] .cmplz-settings-block-intro {
|
|
flex-direction: column;
|
|
gap: var(--rsp-spacing-xs);
|
|
padding-inline: var(--rsp-spacing-l);
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-field-wrap > .cmplz-field-wrap, #complianz div[class^=cmplz-wizard-] .cmplz-settings-block-intro > .cmplz-field-wrap {
|
|
padding-left: 0;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-checkbox, #complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-banner-reset-button, #complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-copy-multisite, #complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-export, #complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-button {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
gap: var(--rsp-spacing-s);
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-checkbox .cmplz-label-container, #complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-banner-reset-button .cmplz-label-container, #complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-copy-multisite .cmplz-label-container, #complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-export .cmplz-label-container, #complianz div[class^=cmplz-wizard-] .cmplz-field-wrap.cmplz-button .cmplz-label-container {
|
|
width: fit-content;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .button {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
gap: var(--rsp-spacing-s);
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-field-button, #complianz div[class^=cmplz-wizard-] .cmplz-export, #complianz div[class^=cmplz-wizard-] .cmplz-import {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
#complianz div[class^=cmplz-wizard-] .cmplz-field-button-form, #complianz div[class^=cmplz-wizard-] .cmplz-export-form, #complianz div[class^=cmplz-wizard-] .cmplz-import-form {
|
|
display: flex;
|
|
}
|
|
|
|
#complianz .cmplz-field-wrap.cmplz-error input,
|
|
#complianz .cmplz-field-wrap.cmplz-error textarea,
|
|
#complianz .cmplz-field-wrap.cmplz-error select {
|
|
box-shadow: 0 0 0 2px var(--rsp-red-faded);
|
|
}
|
|
|
|
#complianz .cmplz-error-text {
|
|
display: flex;
|
|
gap: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
#complianz .cmplz-error-text p {
|
|
color: var(--rsp-red);
|
|
font-size: var(--rsp-fs-200);
|
|
font-weight: 400;
|
|
font-style: italic;
|
|
}
|
|
|
|
#complianz .cmplz-highlight {
|
|
background-color: transparent;
|
|
border-left: 4px solid var(--rsp-green);
|
|
-o-animation: fadeIt 3s ease-in-out;
|
|
animation: fadeIt 3s ease-in-out;
|
|
}
|
|
|
|
#complianz .cmplz-comment {
|
|
font-style: italic;
|
|
}
|
|
|
|
@-o-keyframes fadeIt {
|
|
0% {
|
|
background-color: transparent;
|
|
}
|
|
|
|
30% {
|
|
background-color: var(--rsp-green-faded);
|
|
}
|
|
|
|
100% {
|
|
border-right: 0;
|
|
background-color: inherit;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeIt {
|
|
0% {
|
|
background-color: transparent;
|
|
border-right: 0;
|
|
}
|
|
|
|
30% {
|
|
background-color: var(--rsp-green-faded);
|
|
}
|
|
|
|
100% {
|
|
background-color: inherit;
|
|
}
|
|
}
|
|
|
|
.cmplz-license .cmplz-processing {
|
|
opacity: 0.3;
|
|
}
|
|
|
|
.cmplz-license .cmplz-task-element {
|
|
padding-top: var(--rsp-spacing-s);
|
|
padding-bottom: 0;
|
|
}
|
|
|
|
.cmplz-license .cmplz-license-field {
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz-documents-loader {
|
|
display: flex;
|
|
padding: 0 var(--rsp-spacing-xs);
|
|
}
|
|
|
|
#complianz.cmplz .components-snackbar-list.edit-site-notices {
|
|
z-index: 99999;
|
|
width: max-content;
|
|
position: fixed;
|
|
bottom: var(--rsp-spacing-m);
|
|
right: var(--rsp-spacing-l);
|
|
}
|
|
|
|
#complianz.cmplz .components-snackbar-list.edit-site-notices > div {
|
|
margin-left: auto;
|
|
}
|
|
|
|
#complianz.cmplz .components-snackbar-list.edit-site-notices .components-snackbar {
|
|
background: var(--rsp-background-block-color);
|
|
box-shadow: var(--rsp-box-shadow);
|
|
border-radius: var(--rsp-border-radius);
|
|
color: var(--rsp-color-success);
|
|
background-color: #fff;
|
|
font-weight: 700;
|
|
font-size: 14px;
|
|
}
|
|
|
|
#complianz.cmplz .components-snackbar-list.edit-site-notices .components-snackbar__content {
|
|
padding: 10px;
|
|
}
|
|
|
|
#complianz .cmplz-details-row {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 5px 0;
|
|
}
|
|
|
|
#complianz .cmplz-details-row__buttons {
|
|
flex-direction: row;
|
|
}
|
|
|
|
#complianz .cmplz-details-row__buttons button {
|
|
margin: 10px 10px 10px 0;
|
|
}
|
|
|
|
#complianz .cmplz-details-row > label {
|
|
margin-top: var(--rsp-spacing-s);
|
|
margin-bottom: var(--rsp-spacing-xs);
|
|
font-weight: 500;
|
|
}
|
|
|
|
#complianz .cmplz-details-row input[type=text] {
|
|
flex: 1;
|
|
}
|
|
|
|
#complianz .cmplz-panel__cookie_list .cmplz-panel__list__item {
|
|
background-color: #fff;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
#complianz .cmplz-panel__buttons {
|
|
margin: 10px 0;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
flex-direction: column;
|
|
gap: var(--rsp-spacing-s);
|
|
margin-top: var(--rsp-spacing-s);
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item {
|
|
width: 100%;
|
|
background-color: var(--rsp-grey-200);
|
|
border-radius: var(--rsp-border-radius);
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item__details {
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-s);
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details {
|
|
border-radius: var(--rsp-border-radius);
|
|
border: 1px solid var(--rsp-grey-300);
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary {
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-s);
|
|
display: grid;
|
|
grid-template-columns: auto 1fr auto auto auto;
|
|
align-items: center;
|
|
gap: var(--rsp-spacing-s);
|
|
list-style: none;
|
|
min-height: 40px;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary::-webkit-details-marker {
|
|
display: none;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary::marker {
|
|
display: none;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary > .cmplz-icon {
|
|
padding-top: 5px;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary h5 {
|
|
font-weight: 500;
|
|
font-size: var(--rsp-fs-200);
|
|
display: inline-block;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary .components-toggle-control {
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 0;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary .components-toggle-control .components-flex {
|
|
gap: 0;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary .cmplz-icon-chevron-down {
|
|
transition: all 0.25s ease-in-out;
|
|
transform: rotate(0deg);
|
|
grid-column: -1;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary .cmplz-panel__list__item__icons {
|
|
position: relative;
|
|
grid-column: -2;
|
|
display: flex;
|
|
gap: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details summary .cmplz-panel__list__item__icons .cmplz-button-icon .cmplz-tooltip-icon {
|
|
padding-top: 5px;
|
|
padding-left: 2px;
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details[open] > summary {
|
|
border-bottom: 1px solid var(--rsp-grey-300);
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details[open] > summary > .cmplz-icon-chevron-down {
|
|
transform: rotate(180deg);
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details .cmplz-field-wrap {
|
|
padding-inline: 0;
|
|
padding: 0;
|
|
padding-top: var(--rsp-spacing-m);
|
|
}
|
|
|
|
#complianz .cmplz-panel__list__item details .cmplz-label {
|
|
color: var(--rsp-text-color);
|
|
font-size: var(--rsp-fs-400);
|
|
font-weight: 600;
|
|
margin-bottom: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
#complianz .cmplz-radio-buttons__list {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: var(--rsp-spacing-s);
|
|
}
|
|
|
|
#complianz .cmplz-radio-buttons__list input {
|
|
display: none;
|
|
}
|
|
|
|
#complianz .cmplz-radio-buttons__list input[type=radio]:checked + label {
|
|
background: var(--rsp-green-faded);
|
|
border: 2px solid var(--rsp-green);
|
|
}
|
|
|
|
#complianz .cmplz-radio-buttons__list__item {
|
|
background: var(--rsp-white);
|
|
border: 2px solid transparent;
|
|
padding: var(--rsp-spacing-xs);
|
|
border-radius: var(--rsp-border-radius-input);
|
|
display: grid;
|
|
grid-template-columns: auto auto auto 1fr;
|
|
gap: var(--rsp-spacing-s);
|
|
align-items: center;
|
|
}
|
|
|
|
#complianz .cmplz-radio-buttons__list__item h5 {
|
|
font-weight: 600;
|
|
letter-spacing: 0.3px;
|
|
}
|
|
|
|
#complianz .cmplz-radio-buttons__list__item p {
|
|
font-size: var(--rsp-fs-200);
|
|
color: var(--rsp-text-color-light);
|
|
}
|
|
|
|
.cmplz-suggested-plugin,
|
|
.cmplz-wscscan-alert {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: 20px;
|
|
background-color: #f9f9f9;
|
|
padding: 20px;
|
|
}
|
|
|
|
.cmplz-suggested-plugin-group-title,
|
|
.cmplz-wscscan-alert-group-title {
|
|
font-size: 14px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.cmplz-suggested-plugin-group-desc,
|
|
.cmplz-wscscan-alert-group-desc {
|
|
font-size: 12px;
|
|
white-space: nowrap;
|
|
margin: 4px 0;
|
|
}
|
|
|
|
.cmplz-suggested-plugin-desc-long,
|
|
.cmplz-wscscan-alert-desc-long {
|
|
flex: 1;
|
|
font-size: 12px;
|
|
line-height: 1.6;
|
|
font-weight: 400;
|
|
min-width: 25ch;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.cmplz-suggested-plugin-img,
|
|
.cmplz-wscscan-alert-img {
|
|
width: 70px;
|
|
height: 70px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.cmplz-suggested-plugin button.cmplz-install-plugin,
|
|
.cmplz-wscscan-alert button.cmplz-install-plugin {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.cmplz-suggested-plugin button.cmplz-install-plugin .cmplz-icon,
|
|
.cmplz-wscscan-alert button.cmplz-install-plugin .cmplz-icon {
|
|
margin-left: 10px;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.cmplz-label-container .cmplz-premium a {
|
|
margin-left: 10px;
|
|
font-size: 11px;
|
|
font-weight: 500;
|
|
text-decoration: none;
|
|
padding: 5px;
|
|
background-color: #ecf4ed;
|
|
color: #333;
|
|
}
|
|
|
|
.cmplz-single-document-menu {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
.cmplz-block-editor {
|
|
min-height: 300px;
|
|
}
|
|
|
|
.cmplz-thirdparties .components-base-control .cmplz-label-container, .cmplz-processors .components-base-control .cmplz-label-container {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
:root {
|
|
--toastify-color-light: var(--rsp-white);
|
|
--toastify-color-dark: var(--rsp-black);
|
|
--toastify-color-info: var(--rsp-yellow);
|
|
--toastify-color-success: var(--rsp-green);
|
|
--toastify-color-warning: var(--rsp-orange);
|
|
--toastify-color-error: var(--rsp-red);
|
|
--toastify-color-transparent: rgba(255, 255, 255, 0.7);
|
|
--toastify-icon-color-info: var(--toastify-color-info);
|
|
--toastify-icon-color-success: var(--toastify-color-success);
|
|
--toastify-icon-color-warning: var(--toastify-color-warning);
|
|
--toastify-icon-color-error: var(--toastify-color-error);
|
|
--toastify-toast-width: 320px;
|
|
--toastify-toast-background: #fff;
|
|
--toastify-toast-min-height: 42px;
|
|
--toastify-toast-max-height: 800px;
|
|
--toastify-font-family: sans-serif;
|
|
--toastify-z-index: 999999;
|
|
--toastify-text-color-light: var(--rsp-text-color);
|
|
--toastify-text-color-dark: var(--rsp-text-color-white);
|
|
--toastify-text-color-info: #fff;
|
|
--toastify-text-color-success: #fff;
|
|
--toastify-text-color-warning: #fff;
|
|
--toastify-text-color-error: #fff;
|
|
--toastify-spinner-color: #616161;
|
|
--toastify-spinner-color-empty-area: #e0e0e0;
|
|
--toastify-color-progress-light: linear-gradient(
|
|
to right,
|
|
#4cd964,
|
|
#5ac8fa,
|
|
#007aff,
|
|
#34aadc,
|
|
#5856d6,
|
|
#ff2d55
|
|
);
|
|
--toastify-color-progress-dark: #bb86fc;
|
|
--toastify-color-progress-info: var(--toastify-color-info);
|
|
--toastify-color-progress-success: var(--toastify-color-success);
|
|
--toastify-color-progress-warning: var(--toastify-color-warning);
|
|
--toastify-color-progress-error: var(--toastify-color-error);
|
|
}
|
|
|
|
.Toastify__toast-container {
|
|
z-index: var(--toastify-z-index);
|
|
-webkit-transform: translate3d(0, 0, var(--toastify-z-index) px);
|
|
position: fixed;
|
|
padding: 4px;
|
|
width: var(--toastify-toast-width);
|
|
box-sizing: border-box;
|
|
color: #fff;
|
|
}
|
|
|
|
.Toastify__toast-container--top-left {
|
|
top: 1em;
|
|
left: 1em;
|
|
}
|
|
|
|
.Toastify__toast-container--top-center {
|
|
top: calc(2em + 32px);
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
}
|
|
|
|
.Toastify__toast-container--top-right {
|
|
top: 1em;
|
|
right: 1em;
|
|
}
|
|
|
|
.Toastify__toast-container--bottom-left {
|
|
bottom: 1em;
|
|
left: 1em;
|
|
}
|
|
|
|
.Toastify__toast-container--bottom-center {
|
|
bottom: 1em;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
}
|
|
|
|
.Toastify__toast-container--bottom-right {
|
|
bottom: 1em;
|
|
right: 1em;
|
|
}
|
|
|
|
@media only screen and (max-width : 480px) {
|
|
.Toastify__toast-container {
|
|
width: 100vw;
|
|
padding: 0;
|
|
left: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.Toastify__toast-container--top-left, .Toastify__toast-container--top-center, .Toastify__toast-container--top-right {
|
|
top: 0;
|
|
transform: translateX(0);
|
|
}
|
|
|
|
.Toastify__toast-container--bottom-left, .Toastify__toast-container--bottom-center, .Toastify__toast-container--bottom-right {
|
|
bottom: 0;
|
|
transform: translateX(0);
|
|
}
|
|
|
|
.Toastify__toast-container--rtl {
|
|
right: 0;
|
|
left: initial;
|
|
}
|
|
}
|
|
|
|
.Toastify__toast {
|
|
position: relative;
|
|
min-height: var(--toastify-toast-min-height);
|
|
box-sizing: border-box;
|
|
margin-bottom: 1rem;
|
|
padding: 8px;
|
|
border-radius: var(--rsp-border-radius);
|
|
border: 1px solid #eeeeee;
|
|
box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 15px 0 rgba(0, 0, 0, 0.05);
|
|
box-shadow: var(--rsp-box-shadow);
|
|
display: flex;
|
|
justify-content: space-between;
|
|
max-height: var(--toastify-toast-max-height);
|
|
overflow: hidden;
|
|
font-family: var(--toastify-font-family);
|
|
cursor: default;
|
|
direction: ltr;
|
|
/* webkit only issue #791 */
|
|
z-index: 0;
|
|
}
|
|
|
|
.Toastify__toast--rtl {
|
|
direction: rtl;
|
|
}
|
|
|
|
.Toastify__toast--close-on-click {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.Toastify__toast-body {
|
|
margin: auto 0;
|
|
flex: 1 1 auto;
|
|
padding: 6px;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.Toastify__toast-body > div:last-child {
|
|
word-break: break-word;
|
|
flex: 1;
|
|
}
|
|
|
|
.Toastify__toast-icon {
|
|
margin-inline-end: 10px;
|
|
width: 20px;
|
|
flex-shrink: 0;
|
|
display: flex;
|
|
}
|
|
|
|
.Toastify--animate {
|
|
animation-fill-mode: both;
|
|
animation-duration: 0.7s;
|
|
}
|
|
|
|
.Toastify--animate-icon {
|
|
animation-fill-mode: both;
|
|
animation-duration: 0.3s;
|
|
}
|
|
|
|
@media only screen and (max-width : 480px) {
|
|
.Toastify__toast {
|
|
margin-bottom: 0;
|
|
border-radius: 0;
|
|
}
|
|
}
|
|
|
|
.Toastify__toast-theme--dark {
|
|
background: var(--toastify-color-dark);
|
|
color: var(--toastify-text-color-dark);
|
|
}
|
|
|
|
.Toastify__toast-theme--light {
|
|
background: var(--toastify-color-light);
|
|
color: var(--toastify-text-color-light);
|
|
}
|
|
|
|
.Toastify__toast-theme--colored.Toastify__toast--default {
|
|
background: var(--toastify-color-light);
|
|
color: var(--toastify-text-color-light);
|
|
}
|
|
|
|
.Toastify__toast-theme--colored.Toastify__toast--info {
|
|
color: var(--toastify-text-color-info);
|
|
background: var(--toastify-color-info);
|
|
}
|
|
|
|
.Toastify__toast-theme--colored.Toastify__toast--success {
|
|
color: var(--toastify-text-color-success);
|
|
background: var(--toastify-color-success);
|
|
}
|
|
|
|
.Toastify__toast-theme--colored.Toastify__toast--warning {
|
|
color: var(--toastify-text-color-warning);
|
|
background: var(--toastify-color-warning);
|
|
}
|
|
|
|
.Toastify__toast-theme--colored.Toastify__toast--error {
|
|
color: var(--toastify-text-color-error);
|
|
background: var(--toastify-color-error);
|
|
}
|
|
|
|
.Toastify__progress-bar-theme--light {
|
|
background: var(--toastify-color-progress-light);
|
|
}
|
|
|
|
.Toastify__progress-bar-theme--dark {
|
|
background: var(--toastify-color-progress-dark);
|
|
}
|
|
|
|
.Toastify__progress-bar--info {
|
|
background: var(--toastify-color-progress-info);
|
|
}
|
|
|
|
.Toastify__progress-bar--success {
|
|
background: var(--toastify-color-progress-success);
|
|
}
|
|
|
|
.Toastify__progress-bar--warning {
|
|
background: var(--toastify-color-progress-warning);
|
|
}
|
|
|
|
.Toastify__progress-bar--error {
|
|
background: var(--toastify-color-progress-error);
|
|
}
|
|
|
|
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--success, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--error {
|
|
background: var(--toastify-color-transparent);
|
|
}
|
|
|
|
.Toastify__close-button {
|
|
color: #fff;
|
|
background: transparent;
|
|
outline: none;
|
|
border: none;
|
|
padding: 0;
|
|
cursor: pointer;
|
|
opacity: 0.7;
|
|
transition: 0.3s ease;
|
|
align-self: flex-start;
|
|
}
|
|
|
|
.Toastify__close-button--light {
|
|
color: #000;
|
|
opacity: 0.3;
|
|
}
|
|
|
|
.Toastify__close-button > svg {
|
|
fill: currentColor;
|
|
height: 16px;
|
|
width: 14px;
|
|
}
|
|
|
|
.Toastify__close-button:hover, .Toastify__close-button:focus {
|
|
opacity: 1;
|
|
}
|
|
|
|
@keyframes Toastify__trackProgress {
|
|
0% {
|
|
transform: scaleX(1);
|
|
}
|
|
|
|
100% {
|
|
transform: scaleX(0);
|
|
}
|
|
}
|
|
|
|
.Toastify__progress-bar {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 5px;
|
|
z-index: var(--toastify-z-index);
|
|
opacity: 0.7;
|
|
transform-origin: left;
|
|
}
|
|
|
|
.Toastify__progress-bar--animated {
|
|
animation: Toastify__trackProgress linear 1 forwards;
|
|
}
|
|
|
|
.Toastify__progress-bar--controlled {
|
|
transition: transform 0.2s;
|
|
}
|
|
|
|
.Toastify__progress-bar--rtl {
|
|
right: 0;
|
|
left: initial;
|
|
transform-origin: right;
|
|
}
|
|
|
|
.Toastify__spinner {
|
|
width: 20px;
|
|
height: 20px;
|
|
box-sizing: border-box;
|
|
border: 2px solid;
|
|
border-radius: 100%;
|
|
border-color: var(--toastify-spinner-color-empty-area);
|
|
border-right-color: var(--toastify-spinner-color);
|
|
animation: Toastify__spin 0.65s linear infinite;
|
|
}
|
|
|
|
@keyframes Toastify__bounceInRight {
|
|
from, 60%, 75%, 90%, to {
|
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
}
|
|
|
|
from {
|
|
opacity: 0;
|
|
transform: translate3d(3000px, 0, 0);
|
|
}
|
|
|
|
60% {
|
|
opacity: 1;
|
|
transform: translate3d(-25px, 0, 0);
|
|
}
|
|
|
|
75% {
|
|
transform: translate3d(10px, 0, 0);
|
|
}
|
|
|
|
90% {
|
|
transform: translate3d(-5px, 0, 0);
|
|
}
|
|
|
|
to {
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__bounceOutRight {
|
|
20% {
|
|
opacity: 1;
|
|
transform: translate3d(-20px, 0, 0);
|
|
}
|
|
|
|
to {
|
|
opacity: 0;
|
|
transform: translate3d(2000px, 0, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__bounceInLeft {
|
|
from, 60%, 75%, 90%, to {
|
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
}
|
|
|
|
0% {
|
|
opacity: 0;
|
|
transform: translate3d(-3000px, 0, 0);
|
|
}
|
|
|
|
60% {
|
|
opacity: 1;
|
|
transform: translate3d(25px, 0, 0);
|
|
}
|
|
|
|
75% {
|
|
transform: translate3d(-10px, 0, 0);
|
|
}
|
|
|
|
90% {
|
|
transform: translate3d(5px, 0, 0);
|
|
}
|
|
|
|
to {
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__bounceOutLeft {
|
|
20% {
|
|
opacity: 1;
|
|
transform: translate3d(20px, 0, 0);
|
|
}
|
|
|
|
to {
|
|
opacity: 0;
|
|
transform: translate3d(-2000px, 0, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__bounceInUp {
|
|
from, 60%, 75%, 90%, to {
|
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
}
|
|
|
|
from {
|
|
opacity: 0;
|
|
transform: translate3d(0, 3000px, 0);
|
|
}
|
|
|
|
60% {
|
|
opacity: 1;
|
|
transform: translate3d(0, -20px, 0);
|
|
}
|
|
|
|
75% {
|
|
transform: translate3d(0, 10px, 0);
|
|
}
|
|
|
|
90% {
|
|
transform: translate3d(0, -5px, 0);
|
|
}
|
|
|
|
to {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__bounceOutUp {
|
|
20% {
|
|
transform: translate3d(0, -10px, 0);
|
|
}
|
|
|
|
40%, 45% {
|
|
opacity: 1;
|
|
transform: translate3d(0, 20px, 0);
|
|
}
|
|
|
|
to {
|
|
opacity: 0;
|
|
transform: translate3d(0, -2000px, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__bounceInDown {
|
|
from, 60%, 75%, 90%, to {
|
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
}
|
|
|
|
0% {
|
|
opacity: 0;
|
|
transform: translate3d(0, -3000px, 0);
|
|
}
|
|
|
|
60% {
|
|
opacity: 1;
|
|
transform: translate3d(0, 25px, 0);
|
|
}
|
|
|
|
75% {
|
|
transform: translate3d(0, -10px, 0);
|
|
}
|
|
|
|
90% {
|
|
transform: translate3d(0, 5px, 0);
|
|
}
|
|
|
|
to {
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__bounceOutDown {
|
|
20% {
|
|
transform: translate3d(0, 10px, 0);
|
|
}
|
|
|
|
40%, 45% {
|
|
opacity: 1;
|
|
transform: translate3d(0, -20px, 0);
|
|
}
|
|
|
|
to {
|
|
opacity: 0;
|
|
transform: translate3d(0, 2000px, 0);
|
|
}
|
|
}
|
|
|
|
.Toastify__bounce-enter--top-left, .Toastify__bounce-enter--bottom-left {
|
|
animation-name: Toastify__bounceInLeft;
|
|
}
|
|
|
|
.Toastify__bounce-enter--top-right, .Toastify__bounce-enter--bottom-right {
|
|
animation-name: Toastify__bounceInRight;
|
|
}
|
|
|
|
.Toastify__bounce-enter--top-center {
|
|
animation-name: Toastify__bounceInDown;
|
|
}
|
|
|
|
.Toastify__bounce-enter--bottom-center {
|
|
animation-name: Toastify__bounceInUp;
|
|
}
|
|
|
|
.Toastify__bounce-exit--top-left, .Toastify__bounce-exit--bottom-left {
|
|
animation-name: Toastify__bounceOutLeft;
|
|
}
|
|
|
|
.Toastify__bounce-exit--top-right, .Toastify__bounce-exit--bottom-right {
|
|
animation-name: Toastify__bounceOutRight;
|
|
}
|
|
|
|
.Toastify__bounce-exit--top-center {
|
|
animation-name: Toastify__bounceOutUp;
|
|
}
|
|
|
|
.Toastify__bounce-exit--bottom-center {
|
|
animation-name: Toastify__bounceOutDown;
|
|
}
|
|
|
|
@keyframes Toastify__zoomIn {
|
|
from {
|
|
opacity: 0;
|
|
transform: scale3d(0.3, 0.3, 0.3);
|
|
}
|
|
|
|
50% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__zoomOut {
|
|
from {
|
|
opacity: 1;
|
|
}
|
|
|
|
50% {
|
|
opacity: 0;
|
|
transform: scale3d(0.3, 0.3, 0.3);
|
|
}
|
|
|
|
to {
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
.Toastify__zoom-enter {
|
|
animation-name: Toastify__zoomIn;
|
|
}
|
|
|
|
.Toastify__zoom-exit {
|
|
animation-name: Toastify__zoomOut;
|
|
}
|
|
|
|
@keyframes Toastify__flipIn {
|
|
from {
|
|
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
|
|
animation-timing-function: ease-in;
|
|
opacity: 0;
|
|
}
|
|
|
|
40% {
|
|
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
|
|
animation-timing-function: ease-in;
|
|
}
|
|
|
|
60% {
|
|
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
|
|
opacity: 1;
|
|
}
|
|
|
|
80% {
|
|
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
|
|
}
|
|
|
|
to {
|
|
transform: perspective(400px);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__flipOut {
|
|
from {
|
|
transform: perspective(400px);
|
|
}
|
|
|
|
30% {
|
|
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
|
|
opacity: 1;
|
|
}
|
|
|
|
to {
|
|
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
|
|
opacity: 0;
|
|
}
|
|
}
|
|
|
|
.Toastify__flip-enter {
|
|
animation-name: Toastify__flipIn;
|
|
}
|
|
|
|
.Toastify__flip-exit {
|
|
animation-name: Toastify__flipOut;
|
|
}
|
|
|
|
@keyframes Toastify__slideInRight {
|
|
from {
|
|
transform: translate3d(110%, 0, 0);
|
|
visibility: visible;
|
|
}
|
|
|
|
to {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__slideInLeft {
|
|
from {
|
|
transform: translate3d(-110%, 0, 0);
|
|
visibility: visible;
|
|
}
|
|
|
|
to {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__slideInUp {
|
|
from {
|
|
transform: translate3d(0, 110%, 0);
|
|
visibility: visible;
|
|
}
|
|
|
|
to {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__slideInDown {
|
|
from {
|
|
transform: translate3d(0, -110%, 0);
|
|
visibility: visible;
|
|
}
|
|
|
|
to {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__slideOutRight {
|
|
from {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
|
|
to {
|
|
visibility: hidden;
|
|
transform: translate3d(110%, 0, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__slideOutLeft {
|
|
from {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
|
|
to {
|
|
visibility: hidden;
|
|
transform: translate3d(-110%, 0, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__slideOutDown {
|
|
from {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
|
|
to {
|
|
visibility: hidden;
|
|
transform: translate3d(0, 500px, 0);
|
|
}
|
|
}
|
|
|
|
@keyframes Toastify__slideOutUp {
|
|
from {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
|
|
to {
|
|
visibility: hidden;
|
|
transform: translate3d(0, -500px, 0);
|
|
}
|
|
}
|
|
|
|
.Toastify__slide-enter--top-left, .Toastify__slide-enter--bottom-left {
|
|
animation-name: Toastify__slideInLeft;
|
|
}
|
|
|
|
.Toastify__slide-enter--top-right, .Toastify__slide-enter--bottom-right {
|
|
animation-name: Toastify__slideInRight;
|
|
}
|
|
|
|
.Toastify__slide-enter--top-center {
|
|
animation-name: Toastify__slideInDown;
|
|
}
|
|
|
|
.Toastify__slide-enter--bottom-center {
|
|
animation-name: Toastify__slideInUp;
|
|
}
|
|
|
|
.Toastify__slide-exit--top-left, .Toastify__slide-exit--bottom-left {
|
|
animation-name: Toastify__slideOutLeft;
|
|
}
|
|
|
|
.Toastify__slide-exit--top-right, .Toastify__slide-exit--bottom-right {
|
|
animation-name: Toastify__slideOutRight;
|
|
}
|
|
|
|
.Toastify__slide-exit--top-center {
|
|
animation-name: Toastify__slideOutUp;
|
|
}
|
|
|
|
.Toastify__slide-exit--bottom-center {
|
|
animation-name: Toastify__slideOutDown;
|
|
}
|
|
|
|
@keyframes Toastify__spin {
|
|
from {
|
|
transform: rotate(0deg);
|
|
}
|
|
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
.cmplz-input-group {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
.cmplz input:not([type=radio]) {
|
|
border-radius: var(--rsp-border-radius-xs);
|
|
}
|
|
|
|
.cmplz input {
|
|
border: 1px solid var(--rsp-input-border-color);
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
|
|
font-size: var(--rsp-fs-300);
|
|
line-height: 1.5;
|
|
color: var(--rsp-text-color-light);
|
|
background-color: var(--rsp-white);
|
|
outline: none;
|
|
}
|
|
|
|
.cmplz input:focus {
|
|
border-color: var(--rsp-dark-blue);
|
|
box-shadow: 0 0 0 2px var(--rsp-dark-blue);
|
|
}
|
|
|
|
.cmplz input:disabled {
|
|
background-color: var(--rsp-grey-200);
|
|
color: var(--rsp-grey-400);
|
|
}
|
|
|
|
.cmplz .cmplz-border-input {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, min-content) 3rem;
|
|
grid-template-rows: auto auto;
|
|
grid-template-areas: "input1 input2 input3 input4 button" "label1 label2 label3 label4 .";
|
|
/* second row */
|
|
row-gap: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
.cmplz .cmplz-border-input input {
|
|
width: 8ch;
|
|
border: 1px solid var(--rsp-input-border-color);
|
|
margin-right: -1px;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-side:nth-child(1) {
|
|
grid-area: input1;
|
|
border-radius: var(--rsp-border-radius-xs) 0 0 var(--rsp-border-radius-xs);
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-side:nth-child(3) {
|
|
grid-area: input2;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-side:nth-child(5) {
|
|
grid-area: input3;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-side:nth-child(7) {
|
|
grid-area: input4;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-link {
|
|
background-color: var(--rsp-white);
|
|
grid-area: button;
|
|
border: 1px solid var(--rsp-input-border-color);
|
|
border-radius: 0 var(--rsp-border-radius-xs) var(--rsp-border-radius-xs) 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
line-height: 1;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-link svg path {
|
|
fill: var(--rsp-text-color-light);
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-link.linked {
|
|
background-color: var(--rsp-blue-faded);
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-side-label {
|
|
color: var(--rsp-text-color-light);
|
|
font-size: var(--rsp-fs-100);
|
|
text-align: center;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-side-label:nth-child(2) {
|
|
grid-area: label1;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-side-label:nth-child(4) {
|
|
grid-area: label2;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-side-label:nth-child(6) {
|
|
grid-area: label3;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-side-label:nth-child(8) {
|
|
grid-area: label4;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-unit {
|
|
font-size: var(--rsp-fs-100);
|
|
color: var(--rsp-text-color-light);
|
|
text-align: center;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-content: center;
|
|
}
|
|
|
|
.cmplz .cmplz-border-input-unit select {
|
|
background: #fff url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E) no-repeat right 0px top 55%;
|
|
font-size: var(--rsp-fs-100);
|
|
line-height: 1.5;
|
|
color: var(--rsp-text-color-light);
|
|
border-color: unset;
|
|
border: unset;
|
|
box-shadow: none;
|
|
border-radius: unset;
|
|
padding: 0 16px 0 0;
|
|
min-height: var(--rsp-fs-100);
|
|
max-width: 25rem;
|
|
-webkit-appearance: none;
|
|
background-size: 16px 16px;
|
|
cursor: pointer;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group__item {
|
|
display: flex;
|
|
gap: var(--rsp-spacing-xs);
|
|
background-color: transparent;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group__item .cmplz-icon-check {
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group__item.cmplz-hidden {
|
|
display: none;
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group__checkbox {
|
|
display: flex;
|
|
align-content: center;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 3px;
|
|
width: 16px;
|
|
height: 16px;
|
|
aspect-ratio: 1/1;
|
|
outline: 1px solid var(--rsp-input-border-color);
|
|
transition: background-color 0.2s ease-in-out;
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group__checkbox:hover {
|
|
background-color: var(--rsp-blue-faded);
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group__checkbox:focus {
|
|
box-shadow: 0 0 0 3px var(--rsp-background-color), 0 0 0 5px var(--rsp-dark-blue);
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group__checkbox:disabled {
|
|
background-color: var(--rsp-grey-300);
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group__checkbox:disabled + label {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group__label {
|
|
font-size: var(--rsp-fs-300);
|
|
color: var(--rsp-text-color-light);
|
|
margin: 0 !important;
|
|
}
|
|
|
|
.cmplz .cmplz-checkbox-group .cmplz-button {
|
|
margin-right: auto;
|
|
margin-left: 0;
|
|
}
|
|
|
|
.cmplz .rdt_Table .cmplz-checkbox-group__item {
|
|
padding: 5px;
|
|
}
|
|
|
|
/* reset */
|
|
button {
|
|
all: unset;
|
|
}
|
|
|
|
/* Global Variables */
|
|
:root {
|
|
--button-font-size: var(--rsp-fs-300);
|
|
--button-font-weight: 300;
|
|
--button-line-height: 2;
|
|
--button-letter-spacing: 0.5px;
|
|
--button-transition: all 0.3s ease;
|
|
--button-min-height: 30px;
|
|
--button-padding: 0 10px;
|
|
--button-border-radius: 4px;
|
|
--button-accent-color: #2271b1;
|
|
--button-contrast-color: #000;
|
|
--button-secondary-bg: #fff;
|
|
}
|
|
|
|
/* Button Base Styles */
|
|
a.button, button.button, input.button {
|
|
transition: var(--button-transition);
|
|
margin: 0;
|
|
padding: var(--button-padding);
|
|
border-radius: var(--button-border-radius);
|
|
text-align: center;
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
}
|
|
|
|
a.button--primary, button.button--primary, input.button--primary {
|
|
background: var(--button-accent-color);
|
|
color: var(--button-secondary-bg);
|
|
border: 1px solid var(--button-accent-color);
|
|
}
|
|
|
|
a.button--primary:hover, button.button--primary:hover, input.button--primary:hover {
|
|
background: var(--button-accent-color);
|
|
color: var(--button-secondary-bg);
|
|
border-color: var(--button-accent-color);
|
|
box-shadow: 0 0 0 3px rgba(34, 113, 177, 0.3);
|
|
}
|
|
|
|
a.button--secondary, button.button--secondary, input.button--secondary {
|
|
background: var(--button-secondary-bg);
|
|
color: var(--button-accent-color);
|
|
border: 1px solid var(--button-accent-color);
|
|
}
|
|
|
|
a.button--secondary:hover, button.button--secondary:hover, input.button--secondary:hover {
|
|
background: var(--rsp-grey-200);
|
|
color: var(--button-accent-color);
|
|
border-color: var(--button-accent-color);
|
|
}
|
|
|
|
a.button--tertiary, button.button--tertiary, input.button--tertiary {
|
|
background: var(--rsp-grey-200);
|
|
color: var(--button-accent-color);
|
|
border: 1px solid var(--rsp-grey-300);
|
|
}
|
|
|
|
a.button--tertiary:hover, button.button--tertiary:hover, input.button--tertiary:hover {
|
|
background: var(--rsp-grey-100);
|
|
color: var(--button-accent-color);
|
|
border-color: var(--rsp-grey-400);
|
|
}
|
|
|
|
a.button--error, button.button--error, input.button--error {
|
|
background: var(--rsp-red);
|
|
color: var(--rsp-text-color-white);
|
|
border: 1px solid var(--rsp-red);
|
|
}
|
|
|
|
a.button--error:hover, button.button--error:hover, input.button--error:hover {
|
|
background: var(--rsp-red-faded);
|
|
color: var(--rsp-red);
|
|
border-color: var(--rsp-red);
|
|
box-shadow: 0 0 0 3px rgba(255, 0, 0, 0.3);
|
|
}
|
|
|
|
.cmplz-field-wrap .cmplz-button {
|
|
margin-left: auto;
|
|
}
|
|
|
|
.cmplz-button-icon {
|
|
background: transparent;
|
|
background: var(--rsp-grey-300);
|
|
color: #2271b1;
|
|
border: 1px solid transparent;
|
|
border-radius: 50%;
|
|
width: 1em;
|
|
height: 1em;
|
|
padding: 10px;
|
|
margin: 5px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
transition: all 0.3s ease;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.cmplz-button-icon .cmplz-tooltip-icon {
|
|
padding-top: 3px;
|
|
}
|
|
|
|
.cmplz-button-icon:hover {
|
|
padding: 15px;
|
|
margin: 0;
|
|
}
|
|
|
|
.cmplz-button-icon--delete:hover {
|
|
background: var(--rsp-red-faded);
|
|
}
|
|
|
|
.cmplz-button-icon--delete:hover svg path {
|
|
fill: var(--rsp-red);
|
|
}
|
|
|
|
.cmplz .cmplz-radio-group__item {
|
|
display: flex;
|
|
gap: var(--rsp-spacing-xs);
|
|
background-color: transparent;
|
|
align-items: center;
|
|
}
|
|
|
|
.cmplz .cmplz-radio-group__item button {
|
|
all: unset;
|
|
display: flex;
|
|
align-content: center;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 50%;
|
|
width: 16px;
|
|
height: 16px;
|
|
aspect-ratio: 1/1;
|
|
border: 1px solid var(--rsp-input-border-color);
|
|
transition: background-color 0.2s ease-in-out;
|
|
}
|
|
|
|
.cmplz .cmplz-radio-group__item button:hover {
|
|
background-color: var(--rsp-blue-faded);
|
|
}
|
|
|
|
.cmplz .cmplz-radio-group__item button:focus {
|
|
box-shadow: 0 0 0 3px var(--rsp-background-color), 0 0 0 5px var(--rsp-dark-blue);
|
|
}
|
|
|
|
.cmplz .cmplz-radio-group__item button:disabled {
|
|
background-color: var(--rsp-grey-300);
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.cmplz .cmplz-radio-group__item button:disabled + label {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.cmplz .cmplz-radio-group__indicator {
|
|
background: var(--rsp-dark-blue);
|
|
width: 10px;
|
|
height: 10px;
|
|
aspect-ratio: 1/1;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.cmplz .cmplz-radio-label {
|
|
font-size: var(--rsp-fs-300);
|
|
color: var(--rsp-text-color-light);
|
|
}
|
|
|
|
.cmplz .cmplz-select-group .cmplz-icon > div {
|
|
margin-top: 2px;
|
|
margin-bottom: -2px;
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__trigger {
|
|
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
|
|
font-size: var(--rsp-fs-300);
|
|
color: var(--rsp-text-color-light);
|
|
line-height: 1.5;
|
|
background-color: var(--rsp-white);
|
|
border-radius: var(--rsp-border-radius-xs);
|
|
border: 1px solid var(--rsp-input-border-color);
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__trigger:hover:not([disabled]) {
|
|
background-color: var(--rsp-blue-faded);
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__trigger:focus {
|
|
box-shadow: 0 0 0 2px var(--rsp-dark-blue);
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__trigger[data-placeholder] {
|
|
color: var(--rsp-grey-400);
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__trigger[disabled] {
|
|
background-color: var(--rsp-grey-200);
|
|
color: var(--rsp-grey-400);
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__content {
|
|
width: var(--radix-select-trigger-width);
|
|
max-height: calc(var(--radix-select-content-available-height) - 32px - var(--rsp-spacing-s));
|
|
overflow: hidden;
|
|
background-color: var(--rsp-white);
|
|
border-radius: 0 0 var(--rsp-border-radius-xs) var(--rsp-border-radius-xs);
|
|
border: 1px solid var(--rsp-input-border-color);
|
|
border-top: none;
|
|
box-shadow: 0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2);
|
|
z-index: 14;
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__item {
|
|
line-height: 1;
|
|
padding: var(--rsp-spacing-xs) var(--rsp-spacing-xs);
|
|
font-size: var(--rsp-fs-300);
|
|
color: var(--rsp-text-color-light);
|
|
display: flex;
|
|
align-items: center;
|
|
position: relative;
|
|
user-select: none;
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__item[data-disabled] {
|
|
background: var(--rsp-grey-300);
|
|
color: var(--rsp-grey-500);
|
|
pointer-events: none;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__item[data-highlighted] {
|
|
outline: none;
|
|
background-color: var(--rsp-blue-faded);
|
|
color: var(--rsp-text-color);
|
|
}
|
|
|
|
.cmplz .cmplz-select-group__scroll-button {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 25px;
|
|
background-color: white;
|
|
cursor: default;
|
|
}
|
|
|
|
/* reset */
|
|
button {
|
|
all: unset;
|
|
}
|
|
|
|
.cmplz-field-wrap.cmplz-checkbox .cmplz-comment {
|
|
width: 100%;
|
|
}
|
|
|
|
.cmplz-input-group.cmplz-switch-group {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.cmplz-switch-root {
|
|
width: 42px;
|
|
height: 25px;
|
|
background-color: var(--rsp-blue-faded);
|
|
border-radius: 9999px;
|
|
position: relative;
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
margin: 5px;
|
|
border: 1px solid #a4b1d2;
|
|
}
|
|
|
|
.cmplz-switch-root:disabled {
|
|
opacity: 0.5;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.cmplz-switch-root:focus {
|
|
box-shadow: 0 0 0 3px var(--rsp-white), 0 0 0 5px var(--rsp-dark-blue);
|
|
}
|
|
|
|
.cmplz-switch-root[data-state=checked] {
|
|
background-color: var(--rsp-dark-blue);
|
|
}
|
|
|
|
.cmplz-switch-thumb {
|
|
display: block;
|
|
width: 21px;
|
|
height: 21px;
|
|
background-color: var(--rsp-white);
|
|
border-radius: 9999px;
|
|
box-shadow: 0 2px 2px var(--rsp-dark-blue);
|
|
transition: transform 100ms;
|
|
transform: translateX(2px);
|
|
will-change: transform;
|
|
}
|
|
|
|
.cmplz-switch-thumb[data-state=checked] {
|
|
transform: translateX(19px);
|
|
}
|
|
|
|
.cmplz-switch-root.cmplz-switch-input-tiny {
|
|
width: 35px;
|
|
height: 20px;
|
|
margin: 3px;
|
|
}
|
|
|
|
.cmplz-switch-root.cmplz-switch-input-tiny .cmplz-switch-thumb {
|
|
width: 15px;
|
|
height: 15px;
|
|
box-shadow: 0 1px 1px var(--rsp-dark-blue);
|
|
transform: translateX(2px) translateY(-1px);
|
|
}
|
|
|
|
.cmplz-switch-root.cmplz-switch-input-tiny .cmplz-switch-thumb[data-state=checked] {
|
|
transform: translateX(16px) translateY(-1px);
|
|
}
|
|
|
|
.cmplz-switch-root.cmplz-switch-input-tiny:focus {
|
|
box-shadow: 0 0 0 1px var(--rsp-white), 0 0 0 2px var(--rsp-dark-blue);
|
|
}
|
|
|
|
.cmplz-text-checkbox-input {
|
|
display: grid;
|
|
grid-template-columns: 1fr auto;
|
|
gap: var(--rsp-spacing-xs);
|
|
align-content: center;
|
|
}
|
|
|
|
.cmplz-text-area-input-group {
|
|
position: relative;
|
|
}
|
|
|
|
.cmplz-text-area-input-group__input {
|
|
width: 100%;
|
|
min-height: 50px;
|
|
resize: none;
|
|
padding: 8px;
|
|
font-size: var(--rsp-fs-300);
|
|
color: var(--rsp-text-color-light);
|
|
border: 1px solid var(--rsp-input-border-color);
|
|
border-radius: 4px;
|
|
outline: none;
|
|
transition: border-color 0.2s ease-in-out;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.cmplz-text-area-input-group__input:focus {
|
|
border-color: var(--rsp-dark-blue);
|
|
box-shadow: 0 0 0 2px var(--rsp-dark-blue);
|
|
}
|
|
|
|
.cmplz-text-area-input-group__input:disabled {
|
|
background-color: var(--rsp-grey-200);
|
|
color: var(--rsp-grey-400);
|
|
}
|
|
|
|
.cmplz-password-input-group {
|
|
position: relative;
|
|
}
|
|
|
|
.cmplz-password-input-group .cmplz-icon {
|
|
position: absolute;
|
|
right: 15px;
|
|
top: 8px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
#complianz {
|
|
/**
|
|
Preview to the right
|
|
*/
|
|
}
|
|
|
|
#complianz .cmplz-grid.cmplz-banner {
|
|
margin-bottom: 200px;
|
|
}
|
|
|
|
#complianz .cmplz-cookiebanner-preview-controls {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
#complianz .cmplz-cookiebanner-preview-controls .cmplz-hidden {
|
|
display: none;
|
|
}
|
|
|
|
#complianz .cmplz-cookiebanner-preview-controls .cmplz-logo-container {
|
|
display: flex;
|
|
gap: 40px;
|
|
}
|
|
|
|
#complianz .cmplz-cookiebanner-preview-controls .cmplz-select-group {
|
|
min-width: max(250px, 100%);
|
|
}
|
|
|
|
#complianz .cmplz-cookiebanner-preview-controls ul {
|
|
margin-bottom: 15px;
|
|
}
|
|
|
|
#complianz .cmplz-cookiebanner-preview-controls ul li {
|
|
display: flex;
|
|
cursor: pointer;
|
|
margin: 5px;
|
|
}
|
|
|
|
#complianz .cmplz-cookiebanner-preview-controls ul li .cmplz-icon {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
#complianz .cmplz-cookiebanner-preview-controls ul li.inactive {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
#complianz .cmplz-cookiebanner-preview-controls ul li.loading {
|
|
color: var(--rsp-grey-400);
|
|
}
|
|
|
|
#complianz .cmplz-banner-reset-button button.button.button-default {
|
|
display: flex;
|
|
}
|
|
|
|
#complianz .cmplz-banner-reset-button button.button.button-default .cmplz-icon {
|
|
margin: auto auto auto 10px;
|
|
}
|
|
|
|
#complianz .cmplz-logo-preview {
|
|
margin-top: 10px;
|
|
border: 1px black dashed;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
float: right;
|
|
}
|
|
|
|
#complianz .cmplz-logo-preview.cmplz-clickable {
|
|
cursor: pointer;
|
|
max-width: 90px;
|
|
height: inherit;
|
|
}
|
|
|
|
#complianz .cmplz-logo-preview.cmplz-complianz-logo {
|
|
padding: 5px;
|
|
}
|
|
|
|
#complianz .cmplz-logo-preview.cmplz-complianz-logo svg {
|
|
height: 90px;
|
|
width: 90px;
|
|
}
|
|
|
|
#complianz .cmplz-logo-preview.cmplz-clickable {
|
|
cursor: pointer;
|
|
max-width: 90px;
|
|
height: inherit;
|
|
}
|
|
|
|
#complianz .cmplz-logo-preview.cmplz-complianz-logo {
|
|
padding: 5px;
|
|
}
|
|
|
|
#complianz .cmplz-logo-preview.cmplz-complianz-logo svg {
|
|
height: 90px;
|
|
width: 90px;
|
|
}
|
|
|
|
#complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-bottom {
|
|
margin-right: 20px;
|
|
width: calc(100% - 50px);
|
|
left: 20px;
|
|
}
|
|
|
|
#complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-bottom-left, #complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-bottom-right {
|
|
left: initial;
|
|
right: 0;
|
|
}
|
|
|
|
@media (max-width: 1800px) {
|
|
#complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-bottom-left, #complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-bottom-right {
|
|
transform: translateX(calc(0.3 * var(--cmplz_banner_width)));
|
|
}
|
|
|
|
#complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-bottom-left:hover, #complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-bottom-right:hover {
|
|
animation: slideBannerIn 1s forwards;
|
|
animation-delay: 0s;
|
|
}
|
|
}
|
|
|
|
#complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-center {
|
|
right: 0;
|
|
left: initial;
|
|
transform: initial;
|
|
top: initial;
|
|
bottom: 50px;
|
|
}
|
|
|
|
@media (max-width: 1800px) {
|
|
#complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-center {
|
|
transform: translateX(calc(0.3 * var(--cmplz_banner_width)));
|
|
}
|
|
|
|
#complianz #cmplz-cookiebanner-container .cmplz-cookiebanner.cmplz-center:hover {
|
|
animation: slideBannerIn 1s forwards;
|
|
animation-delay: 0s;
|
|
}
|
|
}
|
|
|
|
@-webkit-keyframes slideBannerIn {
|
|
100% {
|
|
transform: inherit;
|
|
}
|
|
}
|
|
|
|
@keyframes slideBannerIn {
|
|
100% {
|
|
transform: inherit;
|
|
}
|
|
}
|
|
|
|
#complianz {
|
|
/* progress bar */
|
|
}
|
|
|
|
#complianz #cmplz-scan-progress, #complianz #cmplz-sync-progress {
|
|
background-color: #F1F1F1;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
#complianz #cmplz-scan-progress .cmplz-progress-bar, #complianz #cmplz-scan-progress .cmplz-sync-progress-bar, #complianz #cmplz-sync-progress .cmplz-progress-bar, #complianz #cmplz-sync-progress .cmplz-sync-progress-bar {
|
|
height: 20px;
|
|
background-color: var(--rsp-wp-blue);
|
|
transition: width 0.5s;
|
|
-webkit-transition: width 0.5s;
|
|
font-weight: bold;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
#complianz .cmplz-cookie-scan button.button, #complianz .cmplz-cookie-scan select {
|
|
margin-bottom: 10px;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
#complianz .cmplz-cookie-scan details summary {
|
|
grid-template-columns: 1fr auto auto;
|
|
}
|
|
|
|
#complianz button.button.cmplz-reset-button {
|
|
background-color: var(--rsp-color-error);
|
|
border-color: var(--rsp-color-error);
|
|
color: white;
|
|
}
|
|
|
|
#complianz .cmplz-cookiedatabase-controls {
|
|
display: flex;
|
|
gap: 10px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
#complianz .cmplz-cookiedatabase-controls .cmplz-checkbox-group {
|
|
margin-top: 4px;
|
|
}
|
|
|
|
#complianz .cmplz-cookiedatabase-controls details summary {
|
|
grid-template-columns: 1fr auto auto;
|
|
}
|
|
|
|
/**
|
|
Admin notice
|
|
*/
|
|
.cmplz-datatable-search {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.cmplz-no-documents {
|
|
padding: 20px;
|
|
}
|
|
|
|
.cmplz-processing-agreements .rdt_TableHeadRow .rdt_TableCell, .cmplz-processing-agreements .rdt_TableRow .rdt_TableCell, .cmplz-data-breach-reports .rdt_TableHeadRow .rdt_TableCell, .cmplz-data-breach-reports .rdt_TableRow .rdt_TableCell, .cmplz-records-of-consent .rdt_TableHeadRow .rdt_TableCell, .cmplz-records-of-consent .rdt_TableRow .rdt_TableCell, .cmplz-proof-of-consent .rdt_TableHeadRow .rdt_TableCell, .cmplz-proof-of-consent .rdt_TableRow .rdt_TableCell, .cmplz-datarequests .rdt_TableHeadRow .rdt_TableCell, .cmplz-datarequests .rdt_TableRow .rdt_TableCell {
|
|
line-height: unset;
|
|
}
|
|
|
|
.cmplz-processing-agreements .rdt_TableHeadRow input[type=checkbox], .cmplz-processing-agreements .rdt_TableRow input[type=checkbox], .cmplz-data-breach-reports .rdt_TableHeadRow input[type=checkbox], .cmplz-data-breach-reports .rdt_TableRow input[type=checkbox], .cmplz-records-of-consent .rdt_TableHeadRow input[type=checkbox], .cmplz-records-of-consent .rdt_TableRow input[type=checkbox], .cmplz-proof-of-consent .rdt_TableHeadRow input[type=checkbox], .cmplz-proof-of-consent .rdt_TableRow input[type=checkbox], .cmplz-datarequests .rdt_TableHeadRow input[type=checkbox], .cmplz-datarequests .rdt_TableRow input[type=checkbox] {
|
|
margin-left: 10px;
|
|
height: 14px;
|
|
width: 14px;
|
|
min-width: initial;
|
|
}
|
|
|
|
.cmplz-processing-agreements .rdt_TableHeadRow input[type=checkbox]:checked::before, .cmplz-processing-agreements .rdt_TableRow input[type=checkbox]:checked::before, .cmplz-data-breach-reports .rdt_TableHeadRow input[type=checkbox]:checked::before, .cmplz-data-breach-reports .rdt_TableRow input[type=checkbox]:checked::before, .cmplz-records-of-consent .rdt_TableHeadRow input[type=checkbox]:checked::before, .cmplz-records-of-consent .rdt_TableRow input[type=checkbox]:checked::before, .cmplz-proof-of-consent .rdt_TableHeadRow input[type=checkbox]:checked::before, .cmplz-proof-of-consent .rdt_TableRow input[type=checkbox]:checked::before, .cmplz-datarequests .rdt_TableHeadRow input[type=checkbox]:checked::before, .cmplz-datarequests .rdt_TableRow input[type=checkbox]:checked::before {
|
|
margin: -0.25rem 0 0 -0.33rem;
|
|
}
|
|
|
|
.cmplz-processing-agreements .rdt_TableCol:first-child, .cmplz-processing-agreements .rdt_TableCell:first-child, .cmplz-data-breach-reports .rdt_TableCol:first-child, .cmplz-data-breach-reports .rdt_TableCell:first-child, .cmplz-records-of-consent .rdt_TableCol:first-child, .cmplz-records-of-consent .rdt_TableCell:first-child, .cmplz-proof-of-consent .rdt_TableCol:first-child, .cmplz-proof-of-consent .rdt_TableCell:first-child, .cmplz-datarequests .rdt_TableCol:first-child, .cmplz-datarequests .rdt_TableCell:first-child {
|
|
width: 35px;
|
|
min-width: 35px !important;
|
|
}
|
|
|
|
.cmplz-field-wrap .rdt_TableRow {
|
|
padding: var(--rsp-spacing-xs) 0;
|
|
}
|
|
|
|
.cmplz-field-wrap .rdt_TableRow:nth-child(odd) {
|
|
background-color: var(--rsp-grey-200);
|
|
}
|
|
|
|
.cmplz-field-wrap .cmplz-csp-revoked > div:nth-child(-n+3) {
|
|
opacity: 0.3;
|
|
}
|
|
|
|
.cmplz-field-wrap .rdt_TableCol, .cmplz-field-wrap .rdt_TableCell {
|
|
min-width: 50px;
|
|
}
|
|
|
|
.cmplz-field-wrap .rdt_TableRow {
|
|
padding: var(--rsp-spacing-xs) 0;
|
|
}
|
|
|
|
.cmplz-field-wrap .rdt_TableRow:nth-child(odd) {
|
|
background-color: var(--rsp-grey-200);
|
|
}
|
|
|
|
.cmplz-field-wrap .rdt_TableRow .cmplz-status-allowed, .cmplz-field-wrap .rdt_TableRow .cmplz-status-revoked {
|
|
min-width: 110px;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
.cmplz-field-wrap .cmplz-csp-revoked > div:nth-child(-n+3) {
|
|
opacity: 0.3;
|
|
}
|
|
|
|
nav.rdt_Pagination > div > svg {
|
|
display: none !important;
|
|
}
|
|
|
|
.cmplz-field-wrap.cmplz-integrations-services, .cmplz-field-wrap.cmplz-integrations-plugins, .cmplz-field-wrap.cmplz-datarequests, .cmplz-field-wrap.cmplz-processing-agreements, .cmplz-field-wrap.cmplz-data-breach-reports, .cmplz-field-wrap.cmplz-records-of-consent, .cmplz-field-wrap.cmplz-proof-of-consent {
|
|
gap: 0 !important;
|
|
margin-left: calc(-1 * var(--rsp-spacing-l));
|
|
margin-right: calc(-1 * var(--rsp-spacing-l));
|
|
}
|
|
|
|
@media (max-width: 1280px) {
|
|
.cmplz-field-wrap.cmplz-integrations-services, .cmplz-field-wrap.cmplz-integrations-plugins, .cmplz-field-wrap.cmplz-datarequests, .cmplz-field-wrap.cmplz-processing-agreements, .cmplz-field-wrap.cmplz-data-breach-reports, .cmplz-field-wrap.cmplz-records-of-consent, .cmplz-field-wrap.cmplz-proof-of-consent {
|
|
margin-left: calc(-1 * var(--rsp-spacing-m));
|
|
margin-right: calc(-1 * var(--rsp-spacing-m));
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1080px) {
|
|
.cmplz-field-wrap.cmplz-integrations-services, .cmplz-field-wrap.cmplz-integrations-plugins, .cmplz-field-wrap.cmplz-datarequests, .cmplz-field-wrap.cmplz-processing-agreements, .cmplz-field-wrap.cmplz-data-breach-reports, .cmplz-field-wrap.cmplz-records-of-consent, .cmplz-field-wrap.cmplz-proof-of-consent {
|
|
margin-left: calc(-1 * var(--rsp-spacing-s));
|
|
margin-right: calc(-1 * var(--rsp-spacing-s));
|
|
}
|
|
}
|
|
|
|
.cmplz-field-wrap.cmplz-integrations-services > p,
|
|
.cmplz-field-wrap.cmplz-integrations-services > div.cmplz-table-header, .cmplz-field-wrap.cmplz-integrations-plugins > p,
|
|
.cmplz-field-wrap.cmplz-integrations-plugins > div.cmplz-table-header, .cmplz-field-wrap.cmplz-datarequests > p,
|
|
.cmplz-field-wrap.cmplz-datarequests > div.cmplz-table-header, .cmplz-field-wrap.cmplz-processing-agreements > p,
|
|
.cmplz-field-wrap.cmplz-processing-agreements > div.cmplz-table-header, .cmplz-field-wrap.cmplz-data-breach-reports > p,
|
|
.cmplz-field-wrap.cmplz-data-breach-reports > div.cmplz-table-header, .cmplz-field-wrap.cmplz-records-of-consent > p,
|
|
.cmplz-field-wrap.cmplz-records-of-consent > div.cmplz-table-header, .cmplz-field-wrap.cmplz-proof-of-consent > p,
|
|
.cmplz-field-wrap.cmplz-proof-of-consent > div.cmplz-table-header {
|
|
margin: var(--rsp-spacing-xs) var(--rsp-spacing-l);
|
|
}
|
|
|
|
.cmplz-field-wrap .rdt_TableCell:first-child, .cmplz-field-wrap .rdt_TableCol:first-child {
|
|
padding-left: var(--rsp-spacing-l);
|
|
}
|
|
|
|
.cmplz-field-wrap .rdt_TableCell:last-child, .cmplz-field-wrap .rdt_TableCol:last-child {
|
|
padding-right: var(--rsp-spacing-l);
|
|
}
|
|
|
|
#complianz .cmplz-new-features-block .cmplz-grid-item-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
#complianz .cmplz-new-features {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
gap: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
@media only screen and (max-width: 1599px) and (min-width: 1280px) {
|
|
#complianz .cmplz-new-features {
|
|
gap: var(--rsp-spacing-xxs);
|
|
}
|
|
}
|
|
|
|
#complianz .cmplz-new-feature {
|
|
width: 100%;
|
|
color: var(--rsp-text-color-light);
|
|
display: flex;
|
|
align-items: flex-start;
|
|
min-width: 0;
|
|
gap: var(--rsp-spacing-xs);
|
|
text-decoration: none;
|
|
}
|
|
|
|
#complianz .cmplz-new-feature .cmplz-icon {
|
|
margin-top: 2px;
|
|
}
|
|
|
|
#complianz .cmplz-new-feature .cmplz-new-feature-desc p {
|
|
font-size: var(--rsp-fs-300);
|
|
}
|
|
|
|
.cmplz-integrations-placeholder {
|
|
height: 150px;
|
|
}
|
|
|
|
.cmplz-integrations-placeholder div {
|
|
background-color: var(--rsp-grey-200);
|
|
margin: 10px 0;
|
|
height: 30px;
|
|
}
|
|
|
|
.cmplz-table-header {
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz-table-header-controls {
|
|
display: flex;
|
|
margin-left: auto;
|
|
gap: 20px;
|
|
}
|
|
|
|
.cmplz-table-header-controls select {
|
|
height: 20px;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.cmplz-settings-overlay {
|
|
z-index: 99;
|
|
display: grid;
|
|
grid-template-columns: 680px auto;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
background: rgba(255, 255, 255, 0.8);
|
|
}
|
|
|
|
.cmplz-settings-overlay .cmplz-settings-overlay-message {
|
|
position: absolute;
|
|
width: calc(100% - 70px);
|
|
bottom: 0;
|
|
background-color: #fff;
|
|
padding: 15px;
|
|
margin: 20px;
|
|
box-shadow: var(--rsp-box-shadow);
|
|
}
|
|
|
|
@media screen and (max-width: 960px) {
|
|
.cmplz-settings-overlay {
|
|
right: 0;
|
|
}
|
|
}
|
|
|
|
.cmplz-selected-document {
|
|
margin-top: 10px;
|
|
margin-bottom: 10px;
|
|
display: flex;
|
|
background-color: var(--rsp-blue-faded);
|
|
padding: 10px;
|
|
align-items: center;
|
|
}
|
|
|
|
.cmplz-selected-document-controls {
|
|
margin-left: auto;
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz-selected-document button.button + button.button {
|
|
margin-left: 20px;
|
|
}
|
|
|
|
.cmplz-create-processing-agreements, .cmplz-create-data-breach-reports {
|
|
scroll-margin-top: 150px;
|
|
}
|
|
|
|
.cmplz-create-processing-agreements .cmplz-table-header, .cmplz-create-data-breach-reports .cmplz-table-header {
|
|
align-items: baseline;
|
|
}
|
|
|
|
.cmplz-create-processing-agreements .components-select-control, .cmplz-create-data-breach-reports .components-select-control {
|
|
flex-direction: row;
|
|
}
|
|
|
|
.cmplz-conclusion__check {
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz-conclusion__check .cmplz-icon {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.cmplz-shepherd {
|
|
--rsp-black: #333;
|
|
background: var(--rsp-black);
|
|
color: var(--rsp-white);
|
|
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
|
|
width: min(45ch, 100%);
|
|
border-radius: var(--rsp-border-radius-input);
|
|
z-index: 999;
|
|
margin: var(--rsp-spacing-s) !important;
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-arrow, .cmplz-shepherd .shepherd-arrow:before {
|
|
position: absolute;
|
|
width: 16px;
|
|
height: 16px;
|
|
z-index: -1;
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-arrow:before {
|
|
content: "";
|
|
transform: rotate(45deg);
|
|
background: var(--rsp-black);
|
|
}
|
|
|
|
.cmplz-shepherd[data-popper-placement^=top] > .shepherd-arrow {
|
|
bottom: -8px;
|
|
}
|
|
|
|
.cmplz-shepherd[data-popper-placement^=bottom] > .shepherd-arrow {
|
|
top: -8px;
|
|
}
|
|
|
|
.cmplz-shepherd[data-popper-placement^=left] > .shepherd-arrow {
|
|
right: -8px;
|
|
}
|
|
|
|
.cmplz-shepherd[data-popper-placement^=right] > .shepherd-arrow {
|
|
left: -8px;
|
|
}
|
|
|
|
.cmplz-shepherd.shepherd-centered > .shepherd-arrow {
|
|
opacity: 0;
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
min-height: 30px;
|
|
padding-inline: var(--rsp-spacing-s);
|
|
padding-block: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-header .shepherd-title {
|
|
margin: 0;
|
|
color: var(--rsp-white);
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-header button.shepherd-cancel-icon {
|
|
background: transparent;
|
|
border: none;
|
|
outline: none;
|
|
cursor: pointer;
|
|
color: var(--rsp-grey-500);
|
|
font-size: 20px;
|
|
position: relative;
|
|
top: -2px;
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-header button.shepherd-cancel-icon:hover {
|
|
color: var(--rsp-text-color-hover);
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-text {
|
|
padding-inline: var(--rsp-spacing-s);
|
|
padding-block: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-text p {
|
|
margin: 0;
|
|
margin-top: var(--rsp-spacing-xxs);
|
|
color: var(--rsp-white);
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-text p:first-of-type {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.cmplz-shepherd .shepherd-footer {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
min-height: 30px;
|
|
gap: var(--rsp-spacing-xs);
|
|
padding-inline: var(--rsp-spacing-s);
|
|
padding-block: var(--rsp-spacing-xs);
|
|
}
|
|
|
|
.dashboard_page_burst .shepherd-modal-overlay-container {
|
|
display: none;
|
|
}
|
|
|
|
.shepherd-modal-overlay-container {
|
|
display: none;
|
|
}
|
|
|
|
#wpwrap .MuiPopover-root {
|
|
z-index: 999999;
|
|
}
|
|
|
|
#cmplz-date-range-picker-container {
|
|
flex: 1 1 auto;
|
|
flex-wrap: wrap;
|
|
gap: var(--rsp-spacing-xs);
|
|
background-color: var(--rsp-background-block-color);
|
|
box-shadow: var(--rsp-box-shadow);
|
|
z-index: 1;
|
|
border-radius: var(--rsp-border-radius-input);
|
|
}
|
|
|
|
#cmplz-date-range-picker-container.cmplz-date-range-picker-open {
|
|
display: flex;
|
|
}
|
|
|
|
#cmplz-date-range-picker-open-button {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: var(--rsp-filter-padding);
|
|
box-shadow: var(--rsp-box-shadow);
|
|
cursor: pointer;
|
|
gap: var(--rsp-spacing-xs);
|
|
color: var(--rsp-text-color);
|
|
background-color: var(--rsp-input-background-color);
|
|
background: var(--rsp-grey-200);
|
|
border: 1px solid var(--rsp-input-border-color);
|
|
border-radius: var(--rsp-border-radius-input);
|
|
}
|
|
|
|
#cmplz-date-range-picker-open-button .cmplz-icon {
|
|
height: max-content;
|
|
}
|
|
|
|
.rdrCalendarWrapper {
|
|
color: #000000;
|
|
font-size: var(--rsp-fs-400);
|
|
}
|
|
|
|
.rdrDateDisplayWrapper {
|
|
background-color: var(--rsp-green-faded);
|
|
}
|
|
|
|
.rdrDateDisplay {
|
|
margin: 0.833em;
|
|
}
|
|
|
|
.rdrDateDisplayItem {
|
|
border-radius: 4px;
|
|
background-color: rgb(255, 255, 255);
|
|
box-shadow: 0 1px 2px 0 rgba(35, 57, 66, 0.21);
|
|
border: 1px solid transparent;
|
|
}
|
|
|
|
.rdrDateDisplayItem input {
|
|
cursor: pointer;
|
|
height: 2.5em;
|
|
line-height: 2.5em;
|
|
border: 0;
|
|
background: transparent;
|
|
width: 100%;
|
|
color: #849095;
|
|
}
|
|
|
|
.rdrDateDisplayItemActive {
|
|
border-color: currentColor;
|
|
}
|
|
|
|
.rdrDateDisplayItemActive input {
|
|
color: #7d888d;
|
|
}
|
|
|
|
.rdrMonthAndYearWrapper {
|
|
align-items: center;
|
|
height: 60px;
|
|
padding-top: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
.rdrMonthAndYearPickers {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.rdrMonthAndYearPickers select {
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
border: 0;
|
|
background: transparent;
|
|
border-radius: 4px;
|
|
outline: 0;
|
|
color: #3e484f;
|
|
background: url("data:image/svg+xml;utf8,<svg width='9px' height='6px' viewBox='0 0 9 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g id='Artboard' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' transform='translate(-636.000000, -171.000000)' fill-opacity='0.368716033'><g id='input' transform='translate(172.000000, 37.000000)' fill='%230E242F' fill-rule='nonzero'><g id='Group-9' transform='translate(323.000000, 127.000000)'><path d='M142.280245,7.23952813 C141.987305,6.92353472 141.512432,6.92361662 141.219585,7.23971106 C140.926739,7.5558055 140.926815,8.06821394 141.219755,8.38420735 L145.498801,13 L149.780245,8.38162071 C150.073185,8.0656273 150.073261,7.55321886 149.780415,7.23712442 C149.487568,6.92102998 149.012695,6.92094808 148.719755,7.23694149 L145.498801,10.7113732 L142.280245,7.23952813 Z' id='arrow'></path></g></g></g></svg>") no-repeat;
|
|
background-position: right 8px center;
|
|
cursor: pointer;
|
|
text-align: center;
|
|
}
|
|
|
|
.rdrMonthAndYearPickers select:hover {
|
|
background-color: rgba(0, 0, 0, 0.07);
|
|
}
|
|
|
|
.rdrMonthPicker, .rdrYearPicker {
|
|
margin: 0 5px;
|
|
}
|
|
|
|
.rdrNextPrevButton {
|
|
display: block;
|
|
width: 24px;
|
|
height: 24px;
|
|
margin: 0 0.833em;
|
|
padding: 0;
|
|
border: 0;
|
|
border-radius: 5px;
|
|
background: #EFF2F7;
|
|
}
|
|
|
|
.rdrNextPrevButton:hover {
|
|
background: #E1E7F0;
|
|
}
|
|
|
|
.rdrNextPrevButton i {
|
|
display: block;
|
|
width: 0;
|
|
height: 0;
|
|
padding: 0;
|
|
text-align: center;
|
|
border-style: solid;
|
|
margin: auto;
|
|
transform: translate(-3px, 0);
|
|
}
|
|
|
|
.rdrPprevButton i {
|
|
border-width: 4px 6px 4px 4px;
|
|
border-color: transparent rgb(52, 73, 94) transparent transparent;
|
|
transform: translate(-3px, 0);
|
|
}
|
|
|
|
.rdrNextButton i {
|
|
margin: 0 0 0 7px;
|
|
border-width: 4px 4px 4px 6px;
|
|
border-color: transparent transparent transparent rgb(52, 73, 94);
|
|
transform: translate(3px, 0);
|
|
}
|
|
|
|
.rdrWeekDays {
|
|
padding: 0 0.833em;
|
|
}
|
|
|
|
.rdrMonth {
|
|
padding: 0 0.833em 1.666em 0.833em;
|
|
}
|
|
|
|
.rdrMonth .rdrWeekDays {
|
|
padding: 0;
|
|
}
|
|
|
|
.rdrMonths.rdrMonthsVertical .rdrMonth:first-child .rdrMonthName {
|
|
display: none;
|
|
}
|
|
|
|
.rdrWeekDay {
|
|
font-weight: 400;
|
|
line-height: 2.667em;
|
|
color: rgb(132, 144, 149);
|
|
}
|
|
|
|
.rdrDay {
|
|
background: transparent;
|
|
user-select: none;
|
|
border: 0;
|
|
padding: 0;
|
|
aspect-ratio: 1.2/1;
|
|
text-align: center;
|
|
color: var(--rsp-text-color);
|
|
}
|
|
|
|
.rdrDay:focus {
|
|
outline: 0;
|
|
}
|
|
|
|
.rdrDayNumber {
|
|
outline: 0;
|
|
font-weight: 300;
|
|
position: absolute;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.rdrDayToday .rdrDayNumber span {
|
|
font-weight: 500;
|
|
}
|
|
|
|
.rdrDayToday .rdrDayNumber span:after {
|
|
content: "";
|
|
position: absolute;
|
|
bottom: -2px;
|
|
left: 50%;
|
|
transform: translate(-50%, 0);
|
|
width: 4px;
|
|
height: 4px;
|
|
border-radius: 100%;
|
|
background: var(--rsp-green);
|
|
}
|
|
|
|
.rdrDayToday:not(.rdrDayPassive) .rdrInRange ~ .rdrDayNumber span:after, .rdrDayToday:not(.rdrDayPassive) .rdrStartEdge ~ .rdrDayNumber span:after, .rdrDayToday:not(.rdrDayPassive) .rdrEndEdge ~ .rdrDayNumber span:after, .rdrDayToday:not(.rdrDayPassive) .rdrSelected ~ .rdrDayNumber span:after {
|
|
background: #fff;
|
|
}
|
|
|
|
.rdrDay:not(.rdrDayPassive) .rdrInRange ~ .rdrDayNumber span, .rdrDay:not(.rdrDayPassive) .rdrStartEdge ~ .rdrDayNumber span, .rdrDay:not(.rdrDayPassive) .rdrEndEdge ~ .rdrDayNumber span, .rdrDay:not(.rdrDayPassive) .rdrSelected ~ .rdrDayNumber span {
|
|
color: rgba(255, 255, 255, 0.85);
|
|
}
|
|
|
|
.rdrSelected, .rdrInRange, .rdrStartEdge, .rdrEndEdge {
|
|
background: currentColor;
|
|
position: absolute;
|
|
top: 5px;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 5px;
|
|
}
|
|
|
|
.rdrSelected {
|
|
left: 2px;
|
|
right: 2px;
|
|
}
|
|
|
|
.rdrStartEdge {
|
|
border-top-left-radius: var(--rsp-border-radius-input);
|
|
border-bottom-left-radius: var(--rsp-border-radius-input);
|
|
left: 2px;
|
|
}
|
|
|
|
.rdrEndEdge {
|
|
border-top-right-radius: var(--rsp-border-radius-input);
|
|
border-bottom-right-radius: var(--rsp-border-radius-input);
|
|
right: 2px;
|
|
}
|
|
|
|
.rdrSelected {
|
|
border-radius: var(--rsp-border-radius-input);
|
|
}
|
|
|
|
.rdrDayStartOfMonth .rdrInRange, .rdrDayStartOfMonth .rdrEndEdge, .rdrDayStartOfWeek .rdrInRange, .rdrDayStartOfWeek .rdrEndEdge {
|
|
border-top-left-radius: var(--rsp-border-radius-input);
|
|
border-bottom-left-radius: var(--rsp-border-radius-input);
|
|
left: 2px;
|
|
}
|
|
|
|
.rdrDayEndOfMonth .rdrInRange, .rdrDayEndOfMonth .rdrStartEdge, .rdrDayEndOfWeek .rdrInRange, .rdrDayEndOfWeek .rdrStartEdge {
|
|
border-top-right-radius: var(--rsp-border-radius-input);
|
|
border-bottom-right-radius: var(--rsp-border-radius-input);
|
|
right: 2px;
|
|
}
|
|
|
|
.rdrDayStartOfMonth .rdrDayInPreview, .rdrDayStartOfMonth .rdrDayEndPreview, .rdrDayStartOfWeek .rdrDayInPreview, .rdrDayStartOfWeek .rdrDayEndPreview {
|
|
border-top-left-radius: var(--rsp-border-radius-input);
|
|
border-bottom-left-radius: var(--rsp-border-radius-input);
|
|
border-left-width: 2px;
|
|
left: 0;
|
|
}
|
|
|
|
.rdrDayEndOfMonth .rdrDayInPreview, .rdrDayEndOfMonth .rdrDayStartPreview, .rdrDayEndOfWeek .rdrDayInPreview, .rdrDayEndOfWeek .rdrDayStartPreview {
|
|
border-top-right-radius: var(--rsp-border-radius-input);
|
|
border-bottom-right-radius: var(--rsp-border-radius-input);
|
|
border-right-width: 2px;
|
|
right: 0;
|
|
}
|
|
|
|
.rdrDayStartPreview, .rdrDayInPreview, .rdrDayEndPreview {
|
|
background: rgba(255, 255, 255, 0.09);
|
|
position: absolute;
|
|
top: 3px;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 3px;
|
|
pointer-events: none;
|
|
border: 0 solid currentColor;
|
|
z-index: 1;
|
|
}
|
|
|
|
.rdrDayStartPreview {
|
|
border-top-width: 2px;
|
|
border-left-width: 2px;
|
|
border-bottom-width: 2px;
|
|
border-top-left-radius: var(--rsp-border-radius-input);
|
|
border-bottom-left-radius: var(--rsp-border-radius-input);
|
|
left: 0;
|
|
}
|
|
|
|
.rdrDayInPreview {
|
|
border-top-width: 2px;
|
|
border-bottom-width: 2px;
|
|
}
|
|
|
|
.rdrDayEndPreview {
|
|
border-top-width: 2px;
|
|
border-right-width: 2px;
|
|
border-bottom-width: 2px;
|
|
border-top-right-radius: var(--rsp-border-radius-input);
|
|
border-bottom-right-radius: var(--rsp-border-radius-input);
|
|
right: 0;
|
|
}
|
|
|
|
.rdrDefinedRangesWrapper {
|
|
font-size: 12px;
|
|
min-width: 160px;
|
|
width: max-content;
|
|
border-right: solid 1px #eff2f7;
|
|
background: #fff;
|
|
}
|
|
|
|
.rdrDefinedRangesWrapper .rdrStaticRangeSelected {
|
|
color: currentColor;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.rdrStaticRange {
|
|
border: 0;
|
|
cursor: pointer;
|
|
display: block;
|
|
outline: 0;
|
|
border-bottom: 1px solid #eff2f7;
|
|
padding: 0;
|
|
background: #fff;
|
|
}
|
|
|
|
.rdrStaticRange:hover .rdrStaticRangeLabel, .rdrStaticRange:focus .rdrStaticRangeLabel {
|
|
background: #eff2f7;
|
|
}
|
|
|
|
.rdrStaticRangeLabel {
|
|
overflow: hidden;
|
|
display: block;
|
|
outline: 0;
|
|
line-height: 18px;
|
|
padding: 10px 20px;
|
|
text-align: left;
|
|
font-weight: 300;
|
|
}
|
|
|
|
.rdrInputRanges {
|
|
padding: 10px 0;
|
|
}
|
|
|
|
.rdrInputRange {
|
|
align-items: center;
|
|
padding: 5px 20px;
|
|
}
|
|
|
|
.rdrInputRangeInput {
|
|
width: 30px;
|
|
height: 30px;
|
|
line-height: 30px;
|
|
border-radius: 4px;
|
|
text-align: center;
|
|
border: solid 1px rgb(222, 231, 235);
|
|
margin-right: 10px;
|
|
color: rgb(108, 118, 122);
|
|
}
|
|
|
|
.rdrInputRangeInput:focus, .rdrInputRangeInput:hover {
|
|
border-color: rgb(180, 191, 196);
|
|
outline: 0;
|
|
color: #333;
|
|
}
|
|
|
|
.rdrCalendarWrapper:not(.rdrDateRangeWrapper) .rdrDayHovered .rdrDayNumber:after {
|
|
content: "";
|
|
border: 1px solid currentColor;
|
|
border-radius: 1.333em;
|
|
position: absolute;
|
|
top: -2px;
|
|
bottom: -2px;
|
|
left: 0;
|
|
right: 0;
|
|
background: transparent;
|
|
}
|
|
|
|
.rdrDayPassive {
|
|
pointer-events: none;
|
|
}
|
|
|
|
.rdrDayPassive .rdrDayNumber span {
|
|
color: #d5dce0;
|
|
}
|
|
|
|
.rdrDayPassive .rdrInRange, .rdrDayPassive .rdrStartEdge, .rdrDayPassive .rdrEndEdge, .rdrDayPassive .rdrSelected, .rdrDayPassive .rdrDayStartPreview, .rdrDayPassive .rdrDayInPreview, .rdrDayPassive .rdrDayEndPreview {
|
|
display: none;
|
|
}
|
|
|
|
.rdrDayDisabled {
|
|
background-color: rgb(248, 248, 248);
|
|
}
|
|
|
|
.rdrDayDisabled .rdrDayNumber span {
|
|
color: #aeb9bf;
|
|
}
|
|
|
|
.rdrDayDisabled .rdrInRange, .rdrDayDisabled .rdrStartEdge, .rdrDayDisabled .rdrEndEdge, .rdrDayDisabled .rdrSelected, .rdrDayDisabled .rdrDayStartPreview, .rdrDayDisabled .rdrDayInPreview, .rdrDayDisabled .rdrDayEndPreview {
|
|
filter: grayscale(100%) opacity(60%);
|
|
}
|
|
|
|
.rdrMonthName {
|
|
text-align: left;
|
|
font-weight: 600;
|
|
color: #849095;
|
|
padding: var(--rsp-spacing-xxs);
|
|
}
|
|
|
|
.rdrCalendarWrapper {
|
|
box-sizing: border-box;
|
|
background: #ffffff;
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
user-select: none;
|
|
}
|
|
|
|
.rdrDateDisplay {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.rdrDateDisplayItem {
|
|
flex: 1 1;
|
|
width: 0;
|
|
text-align: center;
|
|
color: inherit;
|
|
}
|
|
|
|
.rdrDateDisplayItem + .rdrDateDisplayItem {
|
|
margin-left: 0.833em;
|
|
}
|
|
|
|
.rdrDateDisplayItem input {
|
|
color: var(--rsp-text-color);
|
|
text-align: inherit;
|
|
}
|
|
|
|
.rdrDateDisplayItem input:disabled {
|
|
cursor: default;
|
|
}
|
|
|
|
.rdrMonthAndYearWrapper {
|
|
box-sizing: inherit;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.rdrMonthAndYearPickers {
|
|
flex: 1 1 auto;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.rdrNextPrevButton {
|
|
box-sizing: inherit;
|
|
cursor: pointer;
|
|
outline: none;
|
|
}
|
|
|
|
.rdrMonths {
|
|
display: flex;
|
|
}
|
|
|
|
.rdrMonthsVertical {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.rdrMonthsHorizontal > div > div > div {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.rdrMonth {
|
|
width: 300px;
|
|
}
|
|
|
|
.rdrWeekDays {
|
|
display: flex;
|
|
}
|
|
|
|
.rdrWeekDay {
|
|
flex-basis: 14.2857142857%;
|
|
box-sizing: inherit;
|
|
text-align: center;
|
|
}
|
|
|
|
.rdrDays {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.rdrInfiniteMonths {
|
|
overflow: auto;
|
|
}
|
|
|
|
.rdrDateRangeWrapper {
|
|
user-select: none;
|
|
}
|
|
|
|
.rdrDateInput {
|
|
position: relative;
|
|
}
|
|
|
|
.rdrDateInput input {
|
|
outline: none;
|
|
}
|
|
|
|
.rdrDateInput .rdrWarning {
|
|
position: absolute;
|
|
font-size: 1.6em;
|
|
line-height: 1.6em;
|
|
top: 0;
|
|
right: 0.25em;
|
|
color: #FF0000;
|
|
}
|
|
|
|
.rdrDay {
|
|
box-sizing: inherit;
|
|
width: 14.2857142857%;
|
|
position: relative;
|
|
font: inherit;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.rdrDayNumber {
|
|
display: block;
|
|
position: relative;
|
|
}
|
|
|
|
.rdrDayNumber span {
|
|
color: #1d2429;
|
|
}
|
|
|
|
.rdrDayDisabled {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
@supports (-ms-ime-align: auto) {
|
|
.rdrDay {
|
|
flex-basis: 14.285% !important;
|
|
}
|
|
}
|
|
|
|
.rdrSelected, .rdrInRange, .rdrStartEdge, .rdrEndEdge {
|
|
pointer-events: none;
|
|
}
|
|
|
|
.rdrDayStartPreview, .rdrDayInPreview, .rdrDayEndPreview {
|
|
pointer-events: none;
|
|
}
|
|
|
|
.rdrDateRangePickerWrapper {
|
|
display: inline-flex;
|
|
user-select: none;
|
|
}
|
|
|
|
.rdrStaticRanges {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.rdrStaticRange {
|
|
font-size: inherit;
|
|
}
|
|
|
|
.rdrInputRange {
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz-statistics-status {
|
|
display: flex;
|
|
}
|
|
|
|
.cmplz-statistics-status .cmplz-icon {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.cmplz-tooltip-icon .react-tooltip {
|
|
max-width: 300px;
|
|
z-index: 999999;
|
|
}
|
|
|
|
#complianz {
|
|
/*skeleton*/
|
|
/*loader*/
|
|
}
|
|
|
|
#complianz .cmplz-skeleton:empty {
|
|
margin: auto;
|
|
margin-bottom: 25px;
|
|
width: 100%;
|
|
height: 235px;
|
|
/* change height to see repeat-y behavior */
|
|
background-image: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5) 70%, rgba(255, 255, 255, 0.5) 15%), linear-gradient(#f2f2f2 38px, transparent 0), linear-gradient(#f2f2f2 38px, transparent 0), linear-gradient(#f2f2f2 38px, transparent 0), linear-gradient(#f2f2f2 38px, transparent 0);
|
|
background-repeat: repeat-y;
|
|
background-size: 50px 200px, 100% 117px, 100% 117px, 100% 117px, 100% 117px;
|
|
background-position: 0 0, 1px 1px, 1px 40px, 1px 79px, 1px 118px;
|
|
background-color: #d6d8db;
|
|
border-right: 1px solid #d6d8db;
|
|
animation: shine 2.5s infinite;
|
|
}
|
|
|
|
@keyframes shine {
|
|
to {
|
|
background-position: 100% 0, 1px 1px, 1px 40px, 1px 79px, 1px 118px;
|
|
}
|
|
}
|
|
|
|
#complianz .cmplz-loader {
|
|
margin: 0;
|
|
width: 50px;
|
|
height: 15px;
|
|
text-align: center;
|
|
font-size: 10px;
|
|
}
|
|
|
|
#complianz .cmplz-loader > div {
|
|
margin: 1px;
|
|
background-color: #333;
|
|
height: 100%;
|
|
width: 3px;
|
|
display: inline-block;
|
|
-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
|
|
animation: sk-stretchdelay 1.2s infinite ease-in-out;
|
|
}
|
|
|
|
#complianz .cmplz-loader.cmplz-loader-white > div {
|
|
background-color: #fff;
|
|
}
|
|
|
|
#complianz .cmplz-loader .rect2 {
|
|
-webkit-animation-delay: -1.1s;
|
|
animation-delay: -1.1s;
|
|
}
|
|
|
|
#complianz .cmplz-loader .rect3 {
|
|
-webkit-animation-delay: -1s;
|
|
animation-delay: -1s;
|
|
}
|
|
|
|
#complianz .cmplz-loader .rect4 {
|
|
-webkit-animation-delay: -0.9s;
|
|
animation-delay: -0.9s;
|
|
}
|
|
|
|
#complianz .cmplz-loader .rect5 {
|
|
-webkit-animation-delay: -0.8s;
|
|
animation-delay: -0.8s;
|
|
}
|
|
|
|
#complianz .button-primary .cmplz-loader div {
|
|
background-color: #fff;
|
|
}
|
|
|
|
@-webkit-keyframes sk-stretchdelay {
|
|
0%, 40%, 100% {
|
|
-webkit-transform: scaleY(0.4);
|
|
}
|
|
|
|
20% {
|
|
-webkit-transform: scaleY(1);
|
|
}
|
|
}
|
|
|
|
@keyframes sk-stretchdelay {
|
|
0%, 40%, 100% {
|
|
transform: scaleY(0.4);
|
|
-webkit-transform: scaleY(0.4);
|
|
}
|
|
|
|
20% {
|
|
transform: scaleY(1);
|
|
-webkit-transform: scaleY(1);
|
|
}
|
|
}
|
|
|
|
#complianz {
|
|
--rsp-brand-primary: var(--rsp-dark-blue);
|
|
--rsp-brand-secondary: var(--rsp-blue);
|
|
--rsp-brand-primary-faded: var(--rsp-blue-faded);
|
|
} |