:root{
    --wp-admin-theme-color: #007cba;
    --wp-admin-theme-color--rgb: 0, 124, 186;
    --wp-admin-theme-color-darker-10: #006ba1;
    --wp-admin-theme-color-darker-10--rgb: 0, 107, 161;
    --wp-admin-theme-color-darker-20: #005a87;
    --wp-admin-theme-color-darker-20--rgb: 0, 90, 135;
    --wp-admin-border-width-focus: 2px;
}

h2, h3 {
    color: #1d2327 !important;
    font-size: 1.3em !important;
    margin: 1em 0 !important;
}

.toplevel_page_st div#wpcontent, .spacetree_page_st-api-keys div#wpcontent, .toplevel_page_st-proqyz div#wpcontent{
    padding: 0;
}

body.st_page_st-api-keys{
    background-color: #f0f0f1;
}



.sp-layout_main{
    margin: 0 auto;
    max-width: 100%;
}

span.sp_step {
    display: block;
    padding: 0;
}

span.sp_step-icon {
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display:block;
}

span.sp_step-icon:not(.complete){
    border: 1px solid var(--wp-admin-theme-color);
    background: transparent;
}

span.sp_step-icon:not(.complete):after{
    content: attr(data-index);
    color: var(--wp-admin-theme-color);
    font-weight: 700;
}

span.sp_step-icon:after{
    justify-content: center;
    display: flex;
    align-items: center;
    height: 100%;
    width: 100%;
}

/* utill */
.sp-d-flex {
    display: flex !important;
}

.sp-flex-column {
    flex-direction: column !important;
}

.sp-flex-row {
    flex-direction: row !important;
}

.sp-align-items-center {
    align-items: center !important;
}

.mb-2 {
    margin-bottom: 2rem !important;
}

.mb-4 {
    margin-bottom: 4rem !important;
}

.bb-1-solid {
    border-bottom: 1px solid #ddd4d4;
}

