:root, [data-bs-theme=light] {
    --primary-color: #25d366;
    --email-preview__padding: 11px;
    --email-preview__header-height: 58px;
    --bs-border-radius: 8px;
    --white: #fff;
    --grey-light: #f7fafc;
    --grey: #e6e9eb;
    --grey-medium: #5e6271;
    --grey-strong: #9fa3b5;
    --black: #131e40;
}

[v-cloak] { display: none; }

section.hero {
    background-color: var(--primary-color);
    color: white;
}

section.get-started {
    /* background-color: var(--primary-color);
    color: white; */
}

.faq-item li { padding-left: 16px; }

.footer h4 { font-size: 18px; }
.footer-links-list ul { padding-left:0 }
.footer-links-list ul li {margin-bottom:15px; list-style-type:none;padding-left:0 }
.footer-links-list a {text-decoration:none; color:var(--bs-body-color);}

.container-sm { max-width: 1080px; }
.py-100 {padding-top: 100px !important; padding-bottom: 100px  !important; }
.py-120 {padding-top: 120px !important; padding-bottom: 120px  !important; }
.py-150 {padding-top: 150px !important; padding-bottom: 150px  !important; }

.card {
    --bs-border-color-translucent: rgba(0, 0, 0, 0.12);
}

.navbar-dark {
    --bs-navbar-color: rgba(255, 255, 255, 0.85);
    --bs-navbar-active-color: #fff;
    background-color: var(--primary-color) !important;
}
.navbar-nav .nav-link.active, .navbar-nav .show>.nav-link {
    border-bottom: 2px solid #ffffff;
}

.navbar-brand .logo-img {
    border: 4px solid rgba(255, 255, 255, .44);
    border-radius: 14px;
    width: 44px;
    height: 44px;
}

.btn-icon { font-size: 22px; padding: 0 2px;}
.btn-icon.btn-sm { font-size: 18px; padding: 0 2px;}
.btn-icon.btn-lg { font-size: 25px; padding: 0 2px;}

.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-group-sm>.btn, .btn-sm {
    --bs-btn-border-radius: 0.45rem;
}

.bg-primary { background-color: var(--primary-color) !important; }
.bg-light { background-color: #f7fafc; !important}

.badge-file {
    background-color: #f3f7fa !important;
    font-weight: 400;
    padding: 6px 8px;
    color: #111;
    border: 1px solid rgba(0, 0, 0, .07);
    font-size: 14px;
}

.clickeable-row { cursor: pointer ;}
.clickeable { cursor: pointer ;}
.clickeable:hover { opacity: .7; }

/*  Forms */
.form-row { margin-bottom: 28px; }

.form-row > .form-control,
.form-row > .form-select {
    min-height: 46px;
    font-weight: 300;
    font-size: 15px;
}

.form-row > .form-text {
    font-size: 13px;
    margin-top: 6px;
    margin-bottom: 25px;
    color: var(--grey-medium);
    display: block;
}

.form-row > label {
    margin-bottom: 6px;
    display: block;
    color: var(--grey-medium);
    font-size: 14px;
    font-weight: 400;
}
.form-row .form-control::placeholder {
    color: var(--grey-strong);
    opacity: 1; /* Firefox */
}

.form-row .form-control::-ms-input-placeholder {
    color: var(--grey-strong);
}
hr { opacity: .11;}
/*  Forms */

/* Tables  */
.table-hover>tbody>tr:hover>* {
    --bs-table-hover-bg: var(--grey-light);
    --bs-table-accent-bg: var(--bs-table-hover-bg);
    color: var(--bs-table-hover-color);
}
.table thead th {
    font-weight: 400;
    color: var(--grey-strong);
}
/* Tables  */

.list-group {
    --bs-list-group-active-color: #e9e9e9 !important;
    --bs-list-group-active-bg: #e9e9e9 !important;
    --bs-list-group-active-border-color: #e9e9e9 !important;
}

.list-group-item.active {
    z-index: 2;
    color: #111;
    background-color: var(--bs-list-group-active-bg);
    border-color: var(--bs-list-group-active-border-color);
}