:root{
    --settings-blue:#0a4baa;
    --settings-blue-deep:#063473;
    --settings-red:#d50f3f;
    --settings-ink:#17213a;
    --settings-muted:#66738b;
    --settings-soft:#f4f7fc;
    --settings-line:#dfe6f0;
}

body.sairiki-settings-page{
    background:var(--settings-soft);
    color:var(--settings-ink);
}

.sairiki-settings-page .gt-navbar-green{
    background:var(--settings-blue)!important;
    border-color:var(--settings-blue)!important;
}

.sairiki-settings-page .gt-navbar-green .navbar-nav>li>a{
    color:#fff!important;
}

.sairiki-settings-page .gt-navbar-green .navbar-nav>li.active>a,
.sairiki-settings-page .gt-navbar-green .navbar-nav>li>a:hover,
.sairiki-settings-page .gt-navbar-green .navbar-nav>li>a:focus,
.sairiki-settings-page .gt-navbar-green .navbar-nav>.open>a{
    background:var(--settings-blue-deep)!important;
    color:#fff!important;
}

.sairiki-settings-page .gt-border-right-green,
.sairiki-settings-page .gt-border-left-green{
    border-color:rgba(255,255,255,.16)!important;
}

.sairiki-settings-page .sairiki-settings-container{
    padding-bottom:46px;
}

.sairiki-settings-page .sairiki-settings-heading{
    margin-bottom:18px!important;
    padding-top:6px;
}

.sairiki-settings-page .sairiki-settings-heading .inPageTitle{
    color:var(--settings-blue-deep)!important;
    font-size:28px;
    margin:28px 0 7px;
}

.sairiki-settings-page .sairiki-settings-heading .inPageSubTitle{
    color:var(--settings-muted);
    font-size:13px;
    margin:0 auto;
    max-width:650px;
}

.sairiki-settings-page .sairiki-settings-workspace{
    background:#fff;
    border:1px solid var(--settings-line);
    border-radius:7px;
    box-shadow:0 10px 28px rgba(6,63,152,.08);
    overflow:hidden;
    padding:0;
}

.sairiki-settings-page .sairiki-settings-workspace>.tabpanel,
.sairiki-settings-page .sairiki-settings-workspace>div[role="tabpanel"]{
    width:100%;
}

.sairiki-settings-page .sairiki-settings-workspace .nav-tabs{
    background:#f8faff;
    border:0;
    border-bottom:1px solid var(--settings-line);
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    margin:0;
    padding:0 18px;
}

.sairiki-settings-page .sairiki-settings-workspace .nav-tabs:before,
.sairiki-settings-page .sairiki-settings-workspace .nav-tabs:after{
    content:none;
}

.sairiki-settings-page .sairiki-settings-workspace .nav-tabs>li{
    float:none;
    margin:0;
    width:auto;
}

.sairiki-settings-page .sairiki-settings-workspace .nav-tabs>li>a{
    align-items:center;
    background:transparent!important;
    border:0!important;
    border-bottom:3px solid transparent!important;
    border-radius:0!important;
    box-shadow:none!important;
    color:#536078!important;
    display:flex;
    font-size:12px;
    font-weight:700;
    justify-content:center;
    margin:0;
    min-height:62px;
    padding:15px 10px;
    text-align:center;
}

.sairiki-settings-page .sairiki-settings-workspace .nav-tabs>li>a i{
    color:var(--settings-blue);
    font-size:14px;
}

.sairiki-settings-page .sairiki-settings-workspace .nav-tabs>li.active>a,
.sairiki-settings-page .sairiki-settings-workspace .nav-tabs>li>a:hover,
.sairiki-settings-page .sairiki-settings-workspace .nav-tabs>li>a:focus{
    background:#fff!important;
    border-bottom-color:var(--settings-red)!important;
    color:var(--settings-blue-deep)!important;
}

.sairiki-settings-page .sairiki-settings-workspace .tab-content{
    background:#fff;
    border:0;
    min-height:430px;
    padding:30px;
}

.sairiki-settings-page .sairiki-settings-workspace .tab-pane>.row{
    margin:0;
}

.sairiki-settings-page .sairiki-settings-workspace .tab-pane>.row>[class*=col-]{
    float:none;
    margin:0 auto;
    max-width:920px;
    padding:0;
    width:100%;
}

.sairiki-settings-page .inSearchTitle{
    align-items:center;
    color:var(--settings-blue-deep)!important;
    display:flex;
    font-size:19px;
    margin:0 0 6px;
}

.sairiki-settings-page .inSearchTitle:before{
    background:var(--settings-red);
    border-radius:2px;
    content:"";
    height:20px;
    margin-right:10px;
    width:4px;
}

.sairiki-settings-page .inSearchSubTitle{
    border-bottom:1px solid var(--settings-line)!important;
    color:var(--settings-muted);
    font-size:12px;
    line-height:1.7;
    margin:0 0 22px;
    padding:0 0 16px!important;
}

.sairiki-settings-page #photo-privacy>.row>div>h3+ p+ .row,
.sairiki-settings-page #contact-setting>.row>div>h3+ p+ .row{
    align-items:center;
    background:#f8faff;
    border:1px solid #e1e8f2;
    border-radius:6px;
    display:grid;
    gap:14px;
    grid-template-columns:150px minmax(0,1fr) auto;
    margin:0 0 16px;
    padding:16px 18px;
}

.sairiki-settings-page #photo-privacy>.row>div>h3+ p+ .row:before,
.sairiki-settings-page #photo-privacy>.row>div>h3+ p+ .row:after,
.sairiki-settings-page #contact-setting>.row>div>h3+ p+ .row:before,
.sairiki-settings-page #contact-setting>.row>div>h3+ p+ .row:after{
    content:none;
}

.sairiki-settings-page #photo-privacy>.row>div>h3+ p+ .row>[class*=col-],
.sairiki-settings-page #contact-setting>.row>div>h3+ p+ .row>[class*=col-]{
    float:none;
    padding:0;
    width:auto;
}

.sairiki-settings-page #photo-privacy h5,
.sairiki-settings-page #contact-setting h5{
    color:#34435c;
    font-size:12px;
    font-weight:700;
    line-height:1.55;
    margin:0;
}

.sairiki-settings-page #photo_view_status,
.sairiki-settings-page #contact_view_status{
    align-items:center;
    background:#eef4ff;
    border:1px solid #d4e0f1;
    border-radius:4px;
    color:var(--settings-blue)!important;
    display:inline-flex;
    font-size:11px;
    font-weight:700;
    min-height:36px;
    padding:7px 11px;
}

.sairiki-settings-page #photo-privacy .btn-danger,
.sairiki-settings-page #contact-setting .btn-danger{
    background:var(--settings-blue)!important;
    border-color:var(--settings-blue)!important;
    border-radius:5px;
    color:#fff!important;
    font-size:11px;
    font-weight:700;
    padding:9px 15px;
}

.sairiki-settings-page #photo-settings,
.sairiki-settings-page #contact-show,
.sairiki-settings-page #photo-settings-2{
    padding:0;
    width:100%;
}

.sairiki-settings-page .setting-collapse-bucket{
    background:#f8faff;
    border:1px solid #dfe7f2;
    border-left:3px solid var(--settings-blue);
    border-radius:6px;
    float:none;
    padding:14px;
    width:100%;
}

.sairiki-settings-page .setting-collapse-bucket>.row{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:0;
}

.sairiki-settings-page .setting-collapse-bucket>.row>[class*=col-],
.sairiki-settings-page .setting-collapse-bucket form>[class*=col-]{
    float:none;
    padding:0;
    width:auto;
}

.sairiki-settings-page .setting-collapse-bucket .btn{
    background:#fff!important;
    border:1px solid #cfdaea!important;
    border-radius:5px;
    color:var(--settings-blue-deep)!important;
    font-size:10px;
    font-weight:700;
    min-height:40px;
    white-space:normal;
}

.sairiki-settings-page #photo-privacy>.row>div>.row:not(.gt-margin-top-20){
    align-items:center;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:15px 0 0;
}

.sairiki-settings-page #photo-privacy>.row>div>.row:not(.gt-margin-top-20):before,
.sairiki-settings-page #photo-privacy>.row>div>.row:not(.gt-margin-top-20):after{
    content:none;
}

.sairiki-settings-page #photo-privacy>.row>div>.row:not(.gt-margin-top-20)>[class*=col-]{
    float:none;
    padding:0;
    text-align:left;
    width:auto;
}

.sairiki-settings-page #photo-privacy>.row>div>.row:not(.gt-margin-top-20) a{
    color:var(--settings-blue);
    font-size:11px;
    font-weight:700;
}

.sairiki-settings-page .gt-form-control{
    background:#fff!important;
    border:1px solid #ccd6e5!important;
    border-radius:5px!important;
    box-shadow:none!important;
    color:#34435c!important;
    font-size:12px!important;
    height:44px!important;
    padding:10px 12px!important;
    width:100%;
}

.sairiki-settings-page .gt-form-control:focus{
    border-color:var(--settings-blue)!important;
    box-shadow:0 0 0 3px rgba(10,75,170,.09)!important;
}

.sairiki-settings-page #set_photo_pass_form{
    align-items:center;
    display:flex;
    gap:10px;
    width:100%;
}

.sairiki-settings-page #set_photo_pass_form>[class*=col-]{
    flex:1;
}

.sairiki-settings-page #set_photo_pass_form>[class*=col-]:last-child{
    flex:0 0 auto;
}

.sairiki-settings-page #set_photo_pass_form .btn,
.sairiki-settings-page #change_pass .btn{
    background:var(--settings-blue)!important;
    border-color:var(--settings-blue)!important;
    border-radius:5px;
    color:#fff!important;
    font-size:11px;
    font-weight:700;
    min-height:42px;
    padding:10px 18px;
}

.sairiki-settings-page #blocklist_form{
    display:block;
    width:100%;
}

.sairiki-settings-page #blocklist_form>[class*=col-]{
    float:none;
    max-width:720px;
    padding:0;
    width:100%;
}

.sairiki-settings-page #blocklist_form label,
.sairiki-settings-page #change_pass label{
    color:#34435c;
    font-size:11px;
    font-weight:700;
    margin-bottom:7px;
}

.sairiki-settings-page #blocklist_form .input-group{
    display:flex;
    width:100%;
}

.sairiki-settings-page #blocklist_form .input-group>span:first-child{
    flex:1;
}

.sairiki-settings-page #blocklist_form .input-group-btn{
    width:auto;
}

.sairiki-settings-page #blocklist_form .btn{
    background:var(--settings-red)!important;
    border-color:var(--settings-red)!important;
    border-radius:0 5px 5px 0!important;
    color:#fff!important;
    font-size:11px;
    font-weight:700;
    height:44px;
    padding:9px 18px;
}

.sairiki-settings-page #blocklistdiv>.row{
    margin-left:0;
    margin-right:0;
}

.sairiki-settings-page #blocklistdiv .inSearchTitle{
    font-size:15px;
    margin-top:22px;
}

.sairiki-settings-page #blocklistdiv .gt-setting-blocklist{
    align-items:center;
    background:#fff;
    border:1px solid var(--settings-line);
    border-left:3px solid var(--settings-red);
    border-radius:6px;
    display:flex;
    float:none;
    margin:0 0 12px;
    min-height:145px;
    padding:12px;
    width:100%;
}

.sairiki-settings-page #blocklistdiv .gt-setting-blocklist>[class*=col-]{
    float:none;
    padding:0 8px;
}

.sairiki-settings-page #blocklistdiv .gt-setting-blocklist img{
    aspect-ratio:4/5;
    border-radius:4px;
    height:110px;
    max-height:none;
    object-fit:cover;
    width:88px;
}

.sairiki-settings-page #blocklistdiv .gt-setting-blocklist h4{
    color:var(--settings-blue-deep);
    font-size:13px;
    font-weight:700;
}

.sairiki-settings-page #blocklistdiv .gt-setting-blocklist small{
    color:var(--settings-muted);
    font-size:10px;
    line-height:1.7;
}

.sairiki-settings-page #blocklistdiv .gt-setting-blocklist .btn-danger{
    background:#fff!important;
    border:1px solid #efc8d2!important;
    border-radius:4px;
    color:var(--settings-red)!important;
    font-size:10px;
    font-weight:700;
}

.sairiki-settings-page #change_pass>.row,
.sairiki-settings-page #change_pass{
    margin:0;
}

.sairiki-settings-page #change_pass{
    background:#f8faff;
    border:1px solid #e1e8f2;
    border-radius:6px;
    margin:0 auto;
    max-width:650px;
    padding:20px;
}

.sairiki-settings-page #change_pass>[class*=col-]{
    float:none;
    margin:0 0 14px;
    padding:0;
    width:100%;
}

.sairiki-settings-page #change_pass>[class*=col-]:last-child{
    margin-bottom:0;
    padding-top:4px;
    text-align:right;
}

.sairiki-settings-page #change_pass .alert-danger{
    border-radius:5px;
    font-size:10px;
    margin-top:10px;
}

.sairiki-settings-page .pagination>.active>a,
.sairiki-settings-page .pagination>.active>span,
.sairiki-settings-page .pagination .current{
    background:var(--settings-blue)!important;
    border-color:var(--settings-blue)!important;
    color:#fff!important;
}

@media(max-width:767px){
    .sairiki-settings-page .onlineWidget{
        display:none!important;
    }

    .sairiki-settings-page .sairiki-settings-heading .inPageTitle{
        font-size:23px;
        margin-top:20px;
    }

    .sairiki-settings-page .sairiki-settings-workspace .nav-tabs{
        display:block;
        padding:8px;
    }

    .sairiki-settings-page .sairiki-settings-workspace .nav-tabs>li{
        margin:0 0 4px!important;
    }

    .sairiki-settings-page .sairiki-settings-workspace .nav-tabs>li>a{
        border:1px solid transparent!important;
        border-radius:4px!important;
        justify-content:flex-start;
        min-height:44px;
        padding:11px 13px!important;
    }

    .sairiki-settings-page .sairiki-settings-workspace .nav-tabs>li.active>a{
        background:#eef4ff!important;
        border-color:#d5e1f2!important;
    }

    .sairiki-settings-page .sairiki-settings-workspace .tab-content{
        min-height:360px;
        padding:18px 14px;
    }

    .sairiki-settings-page #photo-privacy>.row>div>h3+ p+ .row,
    .sairiki-settings-page #contact-setting>.row>div>h3+ p+ .row{
        display:block;
        padding:14px;
    }

    .sairiki-settings-page #photo-privacy>.row>div>h3+ p+ .row>[class*=col-],
    .sairiki-settings-page #contact-setting>.row>div>h3+ p+ .row>[class*=col-]{
        margin-bottom:10px;
        width:100%;
    }

    .sairiki-settings-page #set_photo_pass_form{
        display:block;
    }

    .sairiki-settings-page #set_photo_pass_form>[class*=col-]{
        margin-bottom:8px;
        width:100%;
    }

    .sairiki-settings-page #set_photo_pass_form .btn,
    .sairiki-settings-page #change_pass .btn{
        width:100%;
    }

    .sairiki-settings-page #blocklist_form .input-group{
        display:block;
    }

    .sairiki-settings-page #blocklist_form .input-group>span{
        display:block;
        width:100%;
    }

    .sairiki-settings-page #blocklist_form .btn{
        border-radius:5px!important;
        margin-top:8px;
        width:100%;
    }

    .sairiki-settings-page #blocklistdiv .gt-setting-blocklist{
        display:block;
        text-align:center;
    }

    .sairiki-settings-page #blocklistdiv .gt-setting-blocklist>[class*=col-]{
        margin:0;
        width:100%;
    }

    .sairiki-settings-page #blocklistdiv .gt-setting-blocklist img{
        margin:0 auto 10px;
    }

    .sairiki-settings-page #change_pass{
        padding:15px;
    }
}