@import "fonts.css";

:root{
    --font-primary: "Manrope";
    --font-headline: "Quenda";
	--primary: #8AC599;
    --button-text: #ffffff;
    --navbar-white: #ffffff;
    --primarydark: #3EAB34;
    --alternative: #9C1ADF;
    --secondary: #0D2A48;
    --secondarydark: #FE950F;
    --third: #FF5EA2;
    --page-light: #f5f5f5;
    --text-light: #9F9F9F;
    --page: #F5F5F5;
    --white: #ffff;
    --dark: #000000;
    --header-light: #FFFFFF;
    --sidebar-menu: #459a7d;
    --sidebar-text: #cee4dc;
    --sidebar-text-dark: #cee4dc;
    --paper-body: #f3f6f8;
	--alt: #ec524b;
	--paper: #f2f6fc;
	--nav: #94b4a4;
}

body{
  font-size: 12px;
  font-family: var(--font-primary);
}

body h1,
body h2,
body h3,
body h4,
body b,
body strong,
body .headline { font-family: var(--font-headline); }

body .fi{ vertical-align: middle; line-height: 1;}

.shadow-xs	{ box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05); }
.shadow-sm	{ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); }
.shadow	{ box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); }
.shadow-md	{ box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }
.shadow-lg	{ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
.shadow-xl	{ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); }
.shadow-2xl	{ box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); }
.shadow-inner	{ box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06); }
.shadow-outline	{ box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5); }
.shadow-none	{ box-shadow: none; }

.title-font-size-4 { font-size: .25rem!important }
.title-font-size-6 { font-size: .65rem!important }
.title-font-size-8 { font-size: .75rem!important }
.title-font-size-10 { font-size: .95rem!important }
.title-font-size-12 { font-size: 1rem!important }
.title-font-size-14 { font-size: 1.25rem!important }
.title-font-size-16 { font-size: 1.5rem!important }
.title-font-size-18 { font-size: 1.75rem!important }
.title-font-size-20 { font-size: 2rem!important }
.title-font-size-22 { font-size: 2.25rem!important }
.title-font-size-24 { font-size: 2.5rem!important }

.bg-gradient-primary { background: linear-gradient(293deg,#89c599 10%,#0d2a48)!important; }

.icon-2x {width: 20px!important;height: 20px!important;}
.icon-3x {width: 30px!important;height: 30px!important;}
.icon-4x {width: 40px!important;height: 40px!important;}
.icon-5x {width: 50px!important;height: 50px!important;}
.icon-6x {width: 60px!important;height: 60px!important;}
.icon-7x {width: 70px!important;height: 70px!important;}
.icon-8x {width: 80px!important;height: 80px!important;}
.icon-9x {width: 90px!important;height: 90px!important;}

.badge {
	font-size: unset;
	font-weight: unset;
}
.alert {
    background: #36c7ff;
    color: white;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    max-width: 400px;
    top: -20px;
    z-index: 983883;
    border-radius: 14px;
    border: 0;
    box-shadow: 0px 4px 7px -3px #00000029;
    font-family: "Manrope";
}
.iti {
    position: relative;
    display: block;
}

/* FORMS */
.form-control { padding: 0.25rem 1.125rem; }

/* CARD */
.card .card-header {
    background: white;
    border: 0;
    border-radius: inherit;
}
.card.stats .card-body .media p, .card.stats .card-body .media h5 {
    margin: 0;
}

.card.stats .card-body {
    padding: 12px 20px;
}
.card, .card.stats {
    border-radius: 12px;
    border: 0;
}

/* MODAL */
.modal-content {
    border-radius: 20px;
}
.modal-footer, .modal-header {
    border: 0;
}
.modal-header .modal-title {
    font-size: 19px;
    font-family: var(--font-headline);
}
.modal-body {
    font-size: 15px;
}
.modal-body.py-1 {
    padding-top: 1.25rem!important;
    padding-bottom: 1rem!important;
    padding-left: 1rem;
    padding-right: 1rem;
}
.modal-content {
    border-radius: 10px;
}

/* BUTTONS */
.btn {
    padding: 10px 20px;
    border-radius: 10px;
    font-family: var(--font-primary);
}
.btn.btn-primary {
    background-color: var(--primary);
    border-color: var(--primary);
    color: var(--white);
}
.btn.btn-secondary {
    background-color: var(--secondary);
    border-color: var(--secondary);
    color: var(--white);
}

.image_background{
    width: 200px;
    height: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
}
.image_background .image{
    width: 100%;
    height: 100%;
    margin:  auto;
}

.sidenav-light .sidenav-menu .nav-link.active {color: var(--third);font-family: var(--font-headline);}
.sidenav-light .sidenav-menu .nav-link.active svg {color: var(--third);}
.sidenav-light .sidenav-menu .nav-link {font-family: var(--font-headline);}

.nav-tabs .nav-link.active, 
.nav-tabs .nav-link:hover {
    background: var(--primary);
    border-radius: 12px;
    color: white;
    margin-bottom: 8px;
    box-shadow: 0px 1px 6px -3px #cececece;
    border: 0;
}
.nav-tabs .nav-link{ background: white; }
.sidenav-menu .nav .nav-link + div.d-block {
    display: none!important;
}
.sidenav-menu .nav .nav-link.active + div.d-block {
    display: block!important;
}

/* PLANS VIEW */
.custom-switch .custom-control-label::before {
    height: 1.25rem;
    left: -2.25rem;
    width: 2.25rem;
    pointer-events: all;
    border-radius: 1rem;
}
.custom-switch .custom-control-label::after {
    top: calc(0.25rem + 2px);
    left: calc(-2.25rem + 2px);
    width: calc(1rem - 0px);
    height: calc(1rem - 1px);
}
.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
    background-color: #fff;
    transform: translateX(1rem);
}
.custom-control label {
    cursor: pointer;
    margin: -0.15rem 0;
    line-height: 1.75rem;
    padding-left: 5px;
}

/* INVITEES VIEW */
.invitees-box { min-height: 400px;max-height: 400px;height: 400px;overflow: auto; }
.invitees-box .card { padding: 5px; }
.invitees-box .media .profile-image { max-width: 40px;max-height: 40px;border-radius: 12px; }

/* COMMENTS VIEW */
.comments-box .card { padding: 5px; }
.comments-box .media .profile-image { max-width: 30px;max-height: 30px;border-radius: 12px; }

/* PROFILE VIEW */
.profile-box .media .profile-image { max-width: 60px;max-height: 60px;border-radius: 12px; }

/* POST COMMENTS */
.row.deleted p {
    text-decoration: blink;
}
.row.deleted .col i {
    display: none;
}
.row.deleted {
    opacity: 0.3;
}