@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

body.login-page, body.login-page *  {
  font-family: "Plus Jakarta Sans", serif;
  font-optical-sizing: auto;
  /* font-weight: <weight>; */
  font-style: normal;
}

body .text-dark,
body .text-secondary {
    color: #475467 !important
}

#aiAgentTabs  {
    border: 0 !important
}

#aiAgentTabs .nav-item {
    margin-right: 10px !important;
}

#aiAgentTabs .nav-item:last-child {
    margin-right: 0 !important;
}

#aiAgentTabs.nav-tabs .nav-link {
    min-height: 38px;
    line-height: 38px;
    padding-top: 0;
    padding-bottom: 0;
    border-radius: 30px !important;
    background: #fff !important;
    border: 1px solid #e5e5e5 !important;
    font-size: 14px;
}

#aiAgentTabs.nav-tabs .nav-item.show .nav-link,
#aiAgentTabs.nav-tabs .nav-link.active {
    background: #4B24BE !important;
    color: #fff !important;
    border-radius: 30px !important;
}

h1,h2 {
    color: #101828 !important;
}

.header-top {
    background: #fff;
    box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px, rgba(42, 51, 69, 0.04) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.04) 0px 6px 6px -3px, rgba(14, 63, 126, 0.04) 0px 12px 12px -6px, rgba(14, 63, 126, 0.04) 0px 24px 24px -12px;
    padding: 40px 0;
}

.fw-bold {
    font-weight: 700;
}

.fw-medium {
    font-weight: 600;
}

body .text-primary,
a.link {
    color: #4B24BE !important
}

a.link img {
    padding-left: 7px;
}

img {
    transition: 0.5s;
}

a.link:hover img {
    padding-left: 12px;
}

body .shadow-sm.custom-card {
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px !important;
}

.card-link {
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    left: 0;
    top: 0;
}

.custom-card:hover a.link img {
    padding-left: 12px !important;
}

.card.custom-card p.card-text {
    font-size: 14px;
}

.card.custom-card h5.card-title {
    font-size: 19px;
    color: #4B24BE !important;
    font-weight: 500;
}

.custom-card .card-body {
    padding: 20px
}

.custom-card h5.card-title {
    display: flex;
    align-items: center;
    gap: 10px;
}

.custom-card h5.card-title span {
    width: 40px;
    height: 40px;
    background: rgba(217,45,45,0.2);
    display: inline-block;
    text-align: center;
    line-height: 40px;
    border-radius: 10px;;
    display: inline-flex;
    align-items: center;
    justify-content: center;    
    min-width: 40px;
}

.custom-card h5.card-title span svg path {
    fill: #d92d2d
}

 .bgcard-1 h5.card-title span,
 .bgcard-3 h5.card-title span {
    background: rgba(23,178,106,0.2);
}

.bgcard-1  h5.card-title span svg path,
.bgcard-3 h5.card-title span svg path {
    fill: #17B26A;
}

.bgcard-2 h5.card-title span {
    background: rgba(247,144,9,0.2);
}

.bgcard-2 h5.card-title span svg path {
    fill: #F79009;
}

 .bgcard-4 h5.card-title span {
    background: rgba(246,61,104,0.2);
}

 .bgcard-4 h5.card-title span svg path {
    fill: #F63D68;
}

 .bgcard-5 h5.card-title span {
    background: rgba(105,39,218,0.2);
}

 .bgcard-5 h5.card-title span svg path {
    fill: #6927DA;
}

 .bgcard-6 h5.card-title span {
    background: rgba(53,56,205,0.2);
}

 .bgcard-6 h5.card-title span svg path {
    fill: #3538CD;
}

 .bgcard-7 h5.card-title span {
    background: rgba(130,24,144,0.2);
}

 .bgcard-7 h5.card-title span svg path {
    fill: #821890;
}

 .bgcard-8 h5.card-title span {
    background: rgba(234,170,8,0.2);
}

 .bgcard-8 h5.card-title span svg path {
    fill: #EAAA08;
}

 .bgcard-9 h5.card-title span {
    background: rgba(6,174,212,0.2);
}

 .bgcard-9 h5.card-title span svg path {
    fill: #06AED4;
}

.dp {
    width: 160px;
    height: 160px;
    display: inline-block;
    background: #b7d8d3;
    border-radius: 100%;
    border: 5px solid #fff;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    position: relative;
    top: -60px;
}

.dp  svg  {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 50px;
    height: 50px
}

.dp  svg path {
   fill: #15b79e;
}

.header-top.header3 .dp {
    background: #e0bfc7;
}

.header-top.header3 .dp  svg path {
    fill: #e03a61;
 }

.header-top.header2,
.header-top.header3 {
    padding: 30px 0 0;
}

.btn {
    border-radius: 30px !important;
    min-height: 40px;
    font-weight: 500 !important;
    padding-top: 0!important;
    padding-bottom: 0 !important;
    height: 40px;
    line-height: 40px !important;
}

body.login-page .btn-primary {
    background-color: #4B24BE !important;
    border-color: #4B24BE !important;
    position: relative;
    outline: 3px solid transparent;
    transition: 0.5s;
}

body.login-page .btn-primary:hover {
    background-color: #5529d6 !important;
    border-color: #5529d6 !important;
}

body.login-page .btn-primary:active {
    background-color: #4b24be !important;
    border-color: #fff !important;
    outline: 3px solid #4b24be !important;
}

.btn-transparent {
    border-color: #ccc !important;
    border-width: 2px !important;
    border-style: solid !important;
    color: #475467 !important;
}

.btn-transparent:hover {
    border-color: #4B24BE !important
}

.custom-card2 .card-title {
    font-size: 18px;
    color: #000 !important;
    font-weight: 600;
}

.custom-card2 .card-text {
    font-size: 14px;
}

.form-control,
text-area,
select {
    border-radius: 8px !important;
    border-width: 1px !important;
}

.form-control:hover,
.form-control:focus,
textarea:hover,
textarea:focus
select:focus,
select:hover {
    box-shadow:   0 0 0 transparent !important;
    border-color: #4b24be !important;
}


.custom-card2 .card-body {
    padding: 26px;
}

.card-icon {
    min-width: 30px;
    width: 30px;
}

.tab-bgcard-0 .card-icon {
    background: url('../images/jobrole/card-icon1.svg') no-repeat left top;
}

.tab-bgcard-1 .card-icon {
    background: url('../images/jobrole/card-icon2.svg') no-repeat left top;
}

.tab-bgcard-2 .card-icon {
    background: url('../images/jobrole/card-icon3.svg') no-repeat left top;
}

.tab-bgcard-3 .card-icon {
    background: url('../images/jobrole/card-icon4.svg') no-repeat left top;
}

.tab-bgcard-4 .card-icon {
    background: url('../images/jobrole/card-icon5.svg') no-repeat left top;
}

.tab-bgcard-5 .card-icon {
    background: url('../images/jobrole/card-icon6.svg') no-repeat left top;
}

.tab-bgcard-6 .card-icon {
    background: url('../images/jobrole/card-icon1.svg') no-repeat left top;
}

.tab-bgcard-7 .card-icon {
    background: url('../images/jobrole/card-icon2.svg') no-repeat left top;
}

.tab-bgcard-8 .card-icon {
    background: url('../images/jobrole/card-icon3.svg') no-repeat left top;
}

.tab-bgcard-9 .card-icon {
    background: url('../images/jobrole/card-icon4.svg') no-repeat left top;
}

.ai-bg-1,
.ai-bg-2 {
    height: 60px;
    width: 100%;
    display: block;    
}

.ai-bg-1 {
    background: rgb(238,243,242);
    background: linear-gradient(90deg, rgba(238,243,242,1) 0%, rgba(21,180,159,1) 0%, rgba(52,40,177,1) 50%, rgba(25,78,111,1) 100%);
}

.ai-bg-2 {
    background: rgb(238,243,242);
    background: linear-gradient(90deg, rgba(238,243,242,1) 0%, rgba(223,58,97,1) 0%, rgba(55,36,184,1) 50%, rgba(222,58,98,1) 100%);
}

.cusContainer {
    max-width: 84%;
    margin: 0 auto;
}

.fade {
    opacity: 1;
}

.border {
    border-color: #ccc !important;
    border-radius: 5px !important;
}

.login-form {
    max-width: 420px;
    margin: auto;
    color: var(--colors-text-text-secondary-700, #344054);
}
.login-form  form{
    font-size: var(--Font-size-text-sm, 14px);
    font-style: normal;
    font-weight: 500;
    line-height: var(--Line-height-text-sm, 20px); /* 142.857% */
}

label.form-check-label {
    font-size: 14px;
}

.login-form  a.btn.btn-link.px-0 {
    font-size: 12px;
    color: #4B24BE;
    font-weight: 600 !important;
    text-decoration: none;
}
.login-form form label {
    margin-bottom: 5px;
}
.login-form  p {
  color: var(--colors-text-text-tertiary-600, #475467);
  font-size: var(--Font-size-text-md, 15px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--Line-height-text-md, 24px); /* 160% */
}
video{
    border-radius: 20px;
    padding: 24px 0 24px 0;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    -webkit-transform: scale(1.7); 
    -moz-transform: scale(1.7);
}
.login-page{
  overflow: hidden;
}

.login-page .col-md-6{
 overflow: hidden;
}
.copy_text{
    position: absolute;
    bottom: 20px;
    left: 20px;
    width:98%!important;
}

/* data table css starts */
/* new css */
.dataTables_wrapper {
    border: 1px solid #ccc !important;
    border-radius: 10px;
    background: #fff;
    padding-top: 10px;
}

table#agentParamsTable.dataTable.no-footer th,
table#agentParamsTable.dataTable.no-footer td {
    border-left: 0;
    border-right: 0;
}

table#agentParamsTable.dataTable.no-footer th,
table#agentParamsTable.dataTable.no-footer td {
    padding: 10px 20px;
    font-size: 14px;
}

table#agentParamsTable.dataTable.no-footer th {
    border-top: 1px solid #ccc;
}

table#agentParamsTable.dataTable.no-footer tbody tr:last-child td {
    border-bottom: 1px solid #ccc;
}

table.img-table td {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}


table.img-table tbody tr:last-child td {
    border-bottom: 0;
}

table.img-table td,
table.img-table th {
    padding: 10px 20px !important;
}

.agentic .container {
    max-width: 100%;
}

.dataTables_length {
    padding-left: 10px;
}

.dataTables_filter {
    padding-right: 15px;
}

.dataTables_info {
    padding-top: 20px !important;
    padding-left: 20px;
}

.dataTables_paginate.paging_simple_numbers {
    padding-right: 20px;
}

#tab-1 #brandGuideTabs .nav-item .nav-link.active,
#brandGuideTabs .nav-item .nav-link.active {
    color: #fff !important;
}

.tab-content #brandGuideTabs .nav-link {
    color: #4B24BE;
}

#aiAgentTabs.nav-tabs .nav-link {
    min-height: 30px !important; 
    line-height: 30px !important;
}

.dataTables_length select {
    border-radius: 5px !important;
}

.staus-titles {
    background: #fff;
}

.staus-titles.border-1 {
    border: 1px solid #ccc;
    border-radius: 10px;
}

.staus-titles.border-1 table,
.staus-titles.border-1 .table-responsive {
    border-radius: 10px;
}

#tab-2.tab-pane.fade.show {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 10px;
}

#myTab .nav-link.active {
    color: #fff !important;
}
/* data table css ends */

@media (max-width: 1200px) {
    #tab-0 .col-md-4 {
        width: 50%;
    }
}
@media (max-width: 1024px) {
    .cusContainer .col-md-4 {
        width: 50%;
    }
    .header-top .cusContainer .col-md-8 {
        width: 100%;
    }

    .cusRow {
        display: flex;
        flex-wrap: wrap;
    }

    .cusContainer .col-md-4 {
        margin-bottom: 20px;
    }
}

@media (max-width: 991px) {
    .cusContainer .col-md-4 {
        width: 100%;
    }
    .header2 .d-flex,
    .header3 .d-flex {
        display: block !important;
    }
    .header2 h2,
    .header3 h2 {
        margin-top: -40px;
    }
    .header-top.header2, 
    .header-top.header3 {
        padding-bottom: 20px;
    }
}

@media (max-width: 767px) {
    .header-top {
        padding-bottom: 20px !important;
    }

    .header-top.header2  .col-md-3,
    .header-top.header3  .col-md-3{
         margin-top: 20px;
    }

    #tab-0 .col-md-4 {
        width: 100%;
    }

    #tab-1 .col-md-6 {
        width: 100%;
    }

    #aiAgentTabs .nav-item {
        margin-bottom: 10px !important;
        width: 100%;
        display: block;
    }
}