@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,700;1,800;1,900&display=swap');

/*root variable*/

:root{
    --color-primary:#7380ec;
    --color-danger: #ff7782;
    --color-success: #41f1b6;
    --color-warning: #ffbb55;
    --color-white: #fff;
    --color-info-dark: #7d8da1;
    --color-info-light:#dce1eb;
    --color-dark:#363949;
    --color-light: rgba(132, 139, 200, 0.18);
    --color-primary-varient: #111e88;
    --color-dark-varient:#677483;
    --color-background: #f6f6f9;


    --card-border-radius: 2rem;
    --border-radius-1: 0.4rem;
    --border-radius-2: 0.8rem;
    --border-radius-3: 1.2rem;


    --card-padding: 1.8rem;
    --padding-1: 1.2rem;

    --box-shadow: 0 2rem 3rem var(--color-light);
}

/*============= DARK THEME VARIABLE ==================*/

.dark-theme-variables{
    --color-background: #181a1e;
    --color-white: #202528;
    --color-dark: #edeffd;
    --color-dark-varient: #a3bdcc;
    --color-light: rgba(0, 0, 0, 0.4);
    --box-shadow: 0 2rem 3rem var(--color-light);
}


*{
/*   background: #e3e3e3;*/
    margin: 0;
    padding: 0;
    outline: 0;
    appearance: none;
    border: 0;
    text-decoration: none;
    list-style: none;
    box-sizing: border-box;
}


html{
  scroll-behavior: smooth;
  font-size: 14px;
}

body {
/*    font-size: 16px;*/
/*    line-height: 24px;*/
    font-family: 'poppins', sans-serif;
    overflow-x: hidden;
    height: 100vh;
    width: 100vw;
    font-size: 0.88rem;
    background: var(--color-background);
    user-select: none;
    color: var(--color-dark);
}

a{
    color: var(--color-dark);
}

img{
    display: block;
    width: 100%;
}
h1{
    font-weight: 800;
    font-size: 1.8rem;
}
h2{
    font-size: 1.4rem;
}
h3{
    font-size: 0.87rem;
}
h4{
    font-size: 0.8rem;
}

h5{
    font-size: 0.77rem;
}

small{
    font-size: 0.75rem;
}

.profile-photo{
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 50%;
    overflow: hidden;
}

.text-muted{
    color: var(--color-info-dark);
}


p{
    /*font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: #333;*/
    color: var(--color-dark-varient);
}

b{
    color: var(--color-dark);
}

.primary{
    color: var(--color-primary);
}
.danger{
    color: var(--color-danger);
}

.success{
    color: var(--color-success);
}

.warning{
    color: var(--color-warning);
}


/*file upload css*/

.ib-img{
  height: 150px;
  width: 150px;
  overflow: hidden;
}

.ib-img-table{
  height: 100px;
  width: 100px;
  overflow: hidden;
}

/*input[type="file"]{
  background: green;
}*/

.img-file label{
  display: inline-block;
  background-color: indigo;
  color: white;
  padding: 0.5rem;
  font-family: sans-serif;
  border-radius: 0.3rem;
  cursor: pointer;
  margin-top: 1rem;
  width: 100%;
  text-align: center;
  font-weight: 600;
}

.img-file-table label{
  display: inline-block;
  background-color: indigo;
  color: white;
  padding: 0.5rem;
  font-family: sans-serif;
  border-radius: 0.3rem;
  cursor: pointer;
  margin-top: 1rem;
  width: 80%;
  text-align: center;
  font-weight: 600;
}

.ib_row{
    /* overflow-x: scroll;
    width: 100%; */
}

@media screen and (max-width:768px){
    .row.ib_row {
        overflow: scroll;
    }

    .img-file label {
        width: 50%;
    }
}