body {
    font-family: Inter, sans-serif !important;
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
    display: inline;
    vertical-align: middle;
}

.li-username ul.sub-menu {
    right: 0 !important;
}

.username {
    color: #00aaff !important;
    font-weight: 700 !important;
}

.icon_account {
    font-size: 25px;
}

.menu_account_item.active {
    border: 1px solid #00aaff !important;
    color: #00aaff !important;
}

.menu_account_item.active h6 {
    color: #00aaff !important;
}

.menu_account_item {
    padding: 10px 10px !important;
    border: none !important;
}

.box-user-right {
    padding: 40px 40px !important;
}

.inner-page-hero {
    padding-top: 125px !important;
}

.ico-60 i {
    font-size: 60px !important;
    color: #00aaff !important;
}

.box_why .in_tool {
    align-items: center !important;
    padding: 10px 15px !important;
    visibility: visible !important;
}

.box_why .in_tool h6 {
    line-height: 26px !important;
}

.review-txt .review-content {
    min-height: 130px;
    height: 130px;
}

.accordion-thumb h5,
.accordion-thumb h4 {
    line-height: 40px;
}

.price span {
    font-size: 30px !important;
}

.switch-wrap input:checked+.switcher.switcher--theme {
    background-color: #0095e0;
    border-color: #0095e0;
}

@media (min-width: 992px) and (max-width: 1199.95px) {
    .price span {
        font-size: 2.85rem;
        letter-spacing: -3.5px;
    }
}

@media (max-width: 994px) {
    .inner-page-hero {
        padding-top: 50px !important;
    }
}

.pricing-info-table {
    padding: 15px 20px;
}

.box_payment label {
    display: block !important;
}

.braintree-sheet__content--form .braintree-form__field-group .braintree-form__field .braintree-form__hosted-field {
    border-radius: 6px !important;
    border: 1px solid rgb(220, 226, 230) !important;
}

.braintree-option:first-child {
    border-radius: 10px 10px 0px 0px;
}

.braintree-option {
    background: none;
    border-color: rgb(220, 226, 230);
    border-style: solid;
    padding: 18px 24px;
}

.braintree-sheet {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(220, 226, 230);
    border-image: initial;
    border-radius: 10px;
}

.braintree-upper-container {
    border-radius: 10px;
}

.braintree-placeholder,
.braintree-heading {
    display: none;
}

.braintree-sheet__content--form .braintree-form__field-group .braintree-form__field .braintree-form__hosted-field {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(220, 226, 230);
    border-image: initial;
    border-radius: 10px;
}

.braintree-toggle {
    font-size: 17px;
    color: rgb(0, 170, 255);
    font-weight: 400;
    text-align: left;
    background: none;
    padding: 20px 0px 0px;
}

.braintree-toggle span {
    border-width: initial;
    border-style: none;
    border-color: initial;
    border-image: initial;
    text-decoration: underline;
}

.braintree-form__notice-of-collection a {
    color: #00aaff;
}

.braintree-sheet__header .braintree-sheet__text,
.braintree-sheet__header .braintree-sheet__label {
    font-weight: 700;
    color: rgb(61, 71, 77);
}

.braintree-option .braintree-option__label {
    color: rgb(61, 71, 77);
    font-weight: 700;
    font-size: 17px;
}

.box_converter .fbox-2 {
    visibility: visible !important;
}

.download-item {
    padding: 10px 20px;
}

.network-item {
    border-bottom: 1px solid #eee;
    padding: 10px;
}

.network-size {
    color: #353f4f !important;
    font-size: 14px !important;
    line-height: 1;
    margin-bottom: 0;
    background: #12f0e5;
    padding: 3px 6px;
    border-radius: 10px;
}

.network-size-1 {
    color: #fff !important;
    background: #4d94ff !important;
}

.network-size-2 {
    background: #00ffb3 !important;
}

.network-size-3 {
    background: #ff3f79 !important;
    color: #fff !important;
}

.network-size-4 {
    background: #f367e0 !important;
    color: #fff !important;
}

.network-size-5 {
    background: #3affad !important;
}

.network-size-6 {
    background: #fae632 !important;
}

.network-size-7 {
    background: rgb(147, 218, 32) !important;
    color: #fff !important;
}

.network-item-img {
    height: 22px !important;
}

.btn-download-net {
    padding: 10px !important;
    margin-bottom: 10px !important;
}

.btn-download-net span {
    margin-right: 0px !important;
    color: #fff;
}

.user_build {
    justify-content: space-between;
    margin-bottom: 15px;
}

.package_user_name {
    /* background: #ff00bf; */
    /* color: #fff; */
    /* padding: 4px !important; */
    border-radius: 5px;
    margin-right: 2px;
}

.package_user_expired {
    /* background: #00aeff; */
    /* padding: 4px 8px !important; */
    border-radius: 5px;
    /* color: #fff; */
    margin-right: 2px;
    font-weight: bold;
}

.package_user_email {
    /* background: #5c60f5; */
    padding: 4px 8px !important;
    border-radius: 5px;
    font-weight: bold;
    /* color: #fff; */
}

.package_user_email a {
    color: #fff !important;
}

.package_user_email a:hover {
    color: #fff !important;
}

.package_user_remaining {
    /* background: #ffa600; */
    padding: 2px !important;
    border-radius: 5px;
    font-weight: bold;
}

/* Chỉ giữ sidebar expand trên desktop; mobile dùng collapse bình thường */
@media (min-width: 992px) {
    .sidebar_build .collapse {
        visibility: visible !important;
    }
}

/* ========== Mobile: ẩn desktop sidebar, thêm padding cho top bar ========== */
@media (max-width: 991.98px) {
    .main-build {
        margin-left: 0 !important;
        padding-top: 56px !important;
    }
}

.sidebar-item {
    font-weight: bold !important;
}

.btn--download-item {
    padding: 2px 7px !important;
    margin-left: 55px;
}

.justify-content-space-between {
    justify-content: space-between;
}

._bh {
    display: flex;
    align-items: center;
    width: fit-content;
}

._bh ._bn {
    transition: margin 0.25s 0s ease;
    height: 24px;
    width: 24px;
    margin-right: 8px;
    background: #d4d5de;
    border-radius: 4px;
    text-align: center;
}

._bh ._bn .icon-arrow-left {
    width: 24px;
    height: 24px;
    fill: #fff;
}

._3z {
    height: 20px;
    width: 20px;
    display: inline-block;
    vertical-align: middle;
    -webkit-user-select: none;
    user-select: none;
}

._bj,
._bm {
    color: #8c8fa6;
    display: flex;
}

._bj span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 200px;
    display: inline-block;
    align-self: center;
    font-size: 12px;
}

._bh._bi ._bj._bk {
    color: #8c8fa6;
}

._bj,
._bj:hover {
    color: inherit;
    text-decoration: none;
    color: #8c8fa6;
}

._6._a {
    font-weight: 600;
    font-size: 12px;
    color: #1c1e36;
}

._4._a a {
    color: #8c8fa6;
}

.mgt_1 {
    margin-top: 3px;
}

.box-header-build {
    justify-content: space-between;
}

@media (max-width: 994px) {
    .box-header-build {
        display: block !important;
    }

    .box-header-build span {
        margin: 4px 0;
    }

    .mgt_1 {
        margin-top: 4px;
    }
}

@media (max-width: 576px) {
    .mgt_1 {
        margin-top: 6px;
    }
}

.btn-create {
    padding: 8px 12px !important;
    font-size: 14px !important;
}

.btn-create .lucide-circle-plus {
    margin-bottom: 3px;
}

.swal2-title {
    font-size: 20px !important;
}

._9s {
    display: flex;
    align-items: center;
}

._9x img {
    width: 64px;
    height: 64px;
    border-radius: 4px;
    margin-right: 16px;
    object-fit: cover;
}

._9y {
    padding-top: 2px;
    overflow: hidden;
}

._9y ._9z {
    display: flex;
}

._9y ._9z h3 {
    color: #000;
    margin-bottom: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

._9y>span {
    font-size: 0.75rem;
    line-height: 1;
    color: #828282;
}

.bg-gray-custom {
    background: #f1f1f5;
}

.btn-custom {
    padding: 2px 6px !important;
}

.btn-next-page {
    padding: 2px 6px !important;
}

.btn--setting {
    color: #fff !important;
    border-color: #5c60f5 !important;
    background-color: #5c60f5 !important;
}

._9z h3 {
    font-size: 22px;
    font-weight: 700 !important;
}

.btn-download-all {
    padding: 5px 10px !important;
    font-size: 15px !important;
}

.margin-b4 {
    margin-bottom: 4px !important;
}

.user-username {
    /* color: #00aaff !important; */
    font-weight: bold;
}

.drag_file {
    font-size: 16px;
}

.custom_name_file {
    font-size: 12px;
    font-style: italic;
    font-weight: 400 !important;
    line-height: 18px;
}

.ls-tight {
    font-size: 18px !important;
}

.tr-history-build td {
    padding: 20px 15px !important;
}

._2r {
    display: inline-flex;
    padding: 0 8px;
    vertical-align: middle;
    align-items: center;
    line-height: 1;
    border-radius: 30px;
}

._33 {
    color: #a469fc;
    background-color: #efe4fe;
}

._2z {
    height: 22px;
}

._5y {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    font-weight: 600;
    margin: 0 5px;
    font-size: 12.5px;
}

.author_name {
    font-weight: 600;
}

.navbar-vertical .navbar-nav .nav-link {
    font-size: 13px !important;
    padding: 10px 18px !important;
}

.card-header-download {
    padding: 10px 15px !important;
}

.card-header-download {
    padding: 10px 15px !important;
}

.card-header-download h5 {
    font-size: 15.5px !important;
}

/* Pricing*/
.toggle-btn-md .toggler-txt {
    font-size: 18px;
}

.toggle-btn-md .switcher {
    height: 32px;
    padding: 0 20px 0 34px;
    border-radius: 36px;
}

.color--theme {
    font-size: 16px;
}

.pricing-1-table {
    padding: 30px 15px 35px;
}

.row.row-pricing {
    --x-gutter-x: 15px;
    --x-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(var(--x-gutter-y) * -1);
    margin-right: calc(var(--x-gutter-x) * -0.5);
    margin-left: calc(var(--x-gutter-x) * -0.5);
}

.price sup {
    font-size: 25px;
    top: -2px;
}

.pricing-table-header h5 {
    color: #00aaff !important;
}

.price p.color--grey {
    font-size: 15px;
}

.pt-btn {
    /* display: block !important;
    width: 90%; */
    margin: 0 auto !important;
    padding: 8px 10px !important;
}

.pricing-features li p {
    font-size: 15.5px;
}

.btn--curent-plan {
    color: #fff !important;
    border-color: #a469fc !important;
    background-color: #a469fc !important;
}

.btn--curent-plan:hover {
    color: #fff !important;
    border-color: #9957fc !important;
    background-color: #9957fc !important;
}

.hover--curent-plan {
    color: #fff !important;
    border-color: #a469fc !important;
    background-color: #a469fc !important;
}

.btn--cancel {
    color: #fff !important;
    border-color: #f71850 !important;
    background-color: #f71850 !important;
}

.package_user_name a {
    color: #a469fb !important;
    font-weight: bold !important;
}

.box-header-build .text-sm {
    font-size: 14px !important;
}

.btn--setting:hover {
    color: #fff !important;
}

.text-16 {
    font-size: 16px !important;
}

.text-14 {
    font-size: 14px !important;
}

._jq {
    margin-top: 12px;
}

._5m {
    display: inline-flex;
    align-items: center;
}

._44._4d {
    height: 24px;
    padding: 4px 12px;
    line-height: 1rem;
}

.icon-left {
    padding-left: 8px;
}

._44._4d {
    display: inline-flex;
    align-items: center;
    box-shadow: none;
    border: none;
    background-color: #a469fb !important;
    border-radius: 100vh;
    color: #fff;
}

.text_upload {
    margin-left: 5px;
    font-weight: 600;
    font-size: 13px;
    font-family: Inter, Noto Sans, sans-serif;
}

.icon_upload_file {
    background: #fff;
    border-radius: 50%;
    width: 72px;
    height: 72px;
    margin: 0 auto;
    margin-bottom: 8px;
}

.lucide-cloud-upload {
    margin-top: 16px;
}

.bg-sidebar {
    padding: 20px 0 0;
    position: relative;
    color: #999cba !important;
    background: #1c1e36;
    box-shadow: 1px 0 #efefef;
}

.bg-sidebar .nav-link {
    color: #999cba !important;
}

.bg-sidebar .nav-link.actived {
    color: #fff !important;
}

.pl-7 {
    padding-left: 7px;
}

.logo-text {
    color: #fff;
    font-weight: bold;
    margin-left: 5px;
}

.logo-item {
    align-items: center;
}

._my {
    height: 100%;
    min-width: 526px;
    color: #44444480;
    display: flex;
    position: relative;
}

._my input {
    width: 100%;
    padding: 8px 32px;
    border: none;
    border-radius: 100px;
    background-color: #fff;
}

._my input,
._35y {
    color: #1c1e36;
}

._my input {
    -webkit-font-smoothing: antialiased;
    font-family: Inter, Noto Sans, sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 14px;
}

._mz {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translate(50%, -50%);
    width: 20px;
    height: 20px;
    line-height: 20px;
    border-radius: 100px;
    text-align: center;
    font-size: 0.625rem;
    font-weight: 600;
    background-color: #f1f1f5;
    color: #44444480;
}

._my .icon-search-bold {
    width: 13px;
    height: 13px;
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translate(-50%, -50%);
}

.user_plan {
    font-size: 13px !important;
}

.navbar.top-bar {
    background: #f9f9fb !important;
    padding: 17px 0;
}

.text_title {
    -webkit-font-smoothing: antialiased;
    font-family: Inter, sans-serif !important;
    font-size: 22px !important;
    font-weight: 700;
    color: #1c1e36;
    margin-bottom: 16px;
}

.button_new {
    height: 32px;
    padding: 8px 16px;
    line-height: 1rem;
    display: inline-flex;
    align-items: center;
    box-shadow: none;
    border: none;
    background-color: #a469fb;
    border-radius: 100vh;
    color: #fff;
    font-size: 12.25px;
    font-weight: 500;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
a.button_new {
    text-decoration: none;
    color: #fff;
}
a.button_new:hover,
a.button_new:focus {
    text-decoration: none;
    color: #fff;
}
a.button_new.btn-edit-app {
    color: #595b77;
}
a.button_new.btn-edit-app:hover {
    color: #fff !important;
    background-color: #914afa !important;
    border-color: #914afa !important;
}

.lucide.lucide-plus {
    width: 14px;
    height: 14px;
    margin-bottom: 2.5px;
}

.btn--upgrade-item {
    background-color: rgb(255, 170, 0) !important;
    margin-left: 3px;
    height: 26px;
    padding: 5px 12px !important;
    line-height: 1rem !important;
    display: inline-flex !important;
    align-items: center;
    box-shadow: none;
    border: none !important;
    border-radius: 100vh !important;
    color: #fff !important;
    font-size: 12.25px !important;
    font-weight: 500 !important;
}

.btn--build-item {
    background-color: #a469fb !important;
    margin-left: 3px;
    height: 26px;
    padding: 5px 12px !important;
    line-height: 1rem !important;
    display: inline-flex !important;
    align-items: center;
    box-shadow: none;
    border: none !important;
    border-radius: 100vh !important;
    color: #fff !important;
    font-size: 12.25px !important;
    font-weight: 500 !important;
}

.box_title_app {
    margin-top: 10px !important;
}

.box_top_app {
    margin-top: 12px !important;
}

.box_top_app h5 {
    font-family: Inter, Noto Sans, sans-serif;
    font-weight: 500;
    margin-bottom: 0;
    font-size: 0.875rem;
}

.card_table {
    border: 1px solid #e9e9f5;
}

.avatar-app {
    width: 32px !important;
    height: auto !important;
    border-radius: 5px !important;
    object-fit: cover;
    margin-right: 12px;
}

.box_breadcrumbs {
    padding-top: 15px;
    padding-bottom: 15px;
}

a._bn {
    color: #fff !important;
}

.empty-state {
    display: flex;
}

._9k {
    flex-direction: column;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-grow: 1;
    height: calc(100vh - 300px);
}

._9k ._9l {
    font-size: 0.875rem;
    line-height: 1.15;
}

._9k>img {
    margin-bottom: 16px;
}

._9k ._9m {
    margin-top: 4px;
    max-width: 50%;
    min-width: 20em;
    font-size: 1.2rem;
    line-height: 1.2rem;
    text-align: center;
    font-family: Inter, Noto Sans, sans-serif;
    color: #1c1e36;
}

._9k .header-buttons {
    margin-top: 32px;
}

._qr {
    display: flex;
    float: right;
}

.btn-edit-app {
    margin-right: 10px;
    background-color: initial !important;
    border: #595b77 1px solid;
    color: #595b77;
}

.button_new span:hover,
.button_new:hover,
a.button_new:hover span {
    color: #fff !important;
}
.button_new:hover,
a.button_new:hover {
    background-color: #914afa;
    border-color: #914afa;
}

.button_new:disabled {
    background-color: #d4d5de;
    cursor: not-allowed;
    color: #fff;
    pointer-events: auto;
}

.box_top_concepts {
    margin-top: 24px !important;
    margin-bottom: 8px;
}

.box_top_concepts h5 {
    font-weight: 600;
    font-family: Inter, Noto Sans, sans-serif;
    margin-bottom: 0;
    font-size: 0.875rem;
}

._i1 {
    padding: 16px 24px;
    margin-bottom: 24px;
    position: sticky;
    top: 0;
    right: 0;
    left: 0;
    z-index: 60;
    background-color: #f9f9fb;
    border-bottom: 1px solid #e9e9f5;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}

._i1 h3 {
    margin-bottom: 0 !important;
}

h3._2 {
    -webkit-font-smoothing: antialiased;
    font-family: Inter, Noto Sans, sans-serif;
    font-size: 1.375rem;
    font-weight: 700;
    color: #1c1e36;
    margin-bottom: 16px;
}

._i1 ._i2 {
    justify-self: flex-end;
    flex-shrink: 0;
    display: flex;
    column-gap: 8px;
}

.box-upload {
    border-radius: 15px;
}

/* .btn-edit-app span:hover,
.btn-edit-app:hover {
    background-color: initial !important;
    border-color: initial !important;
    border: #595b77 1px solid !important;
    color: #595b77 !important;
} */
.btn-download-app .lucide-download {
    margin-right: 5px;
}

.btn-download-app:disabled,
.btn-download-app:disabled:hover {
    opacity: 1;
    background-color: #d4d5de !important;
    cursor: not-allowed;
    color: #fff !important;
    pointer-events: auto;
}

.header-download {
    display: flex;
    justify-content: space-between;
    padding-left: 16px;
    padding-bottom: 16px;
    padding-top: 0px;
    align-items: center;
}

._81 {
    background-color: #ededef;
}

._58 {
    display: inline-grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(2em, 1fr);
    background-color: #f1f1f5;
    border-radius: 8px;
    padding: 5px;
    height: 32px;
    align-items: center;
}

._5c.active,
._5c:focus {
    color: #1c1e36;
    border-radius: 4px;
    background: #fff;
    fill: #595b77;
}

._5c {
    padding: 4px 8px;
    min-width: 0;
    white-space: nowrap;
    -webkit-font-smoothing: antialiased;
    font-family: Inter, Noto Sans, sans-serif;
    font-weight: 400;
    font-size: 0.75rem;
    line-height: 0.875rem;
    font-weight: 700;
}

._2ip {
    margin: 0;
    padding: 0 8px;
}

._0 {
    font-size: 0.75rem;
    line-height: 1;
    text-transform: uppercase;
    color: #44444480;
}

._1m {
    padding-left: 0;
}

._1m li {
    list-style-type: none;
}

._2it {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4.10592px 8.21184px #00000005;
    border: 1px solid #e9e9f5;
    height: 60px;
    margin-bottom: 8px;
    column-gap: 12px;
}

._2ir {
    padding: 16px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

label._2m6 {
    transition: all 0.25s 0s ease;
    font-size: 0.875rem;
    line-height: 1.15;
    position: relative;
    display: flex;
    align-items: center;
    border: none;
    padding: 0;
    margin-bottom: 0;
    background: none;
    outline: none;
    box-shadow: none;
}

._2it .ad-network-wrapper {
    flex-grow: 1;
    flex-shrink: 0;
    width: auto;
}

._2j3 {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
}

._2ir .badge-wrapper {
    margin-left: 12px;
}

._2qp {
    display: flex;
    justify-content: center;
}

._2r._2s {
    cursor: pointer;
}

._35 {
    color: #22ae7c;
    background-color: #d3f6ea;
}

._2z {
    height: 22px;
}

._2r {
    display: inline-flex;
    padding: 0 8px;
    vertical-align: middle;
    align-items: center;
    line-height: 1;
    border-radius: 30px;
}

._5y {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

._6._a {
    font-weight: 600;
}

._a {
    -webkit-font-smoothing: antialiased;
    font-family: Inter, Noto Sans, sans-serif;
    font-weight: 400;
    font-size: 0.75rem;
    line-height: 0.875rem;
}

._35 {
    color: #22ae7c;
    background-color: #d3f6ea;
}

._35_red {
    color: #b33030;
    background-color: #f0c3c3;
}

.network-img-item {
    height: 45px !important;
}

._hk {
    background-color: #fff;
    border-radius: 16px;
    box-shadow: 0 4.10592px 8.21184px #00000005;
    border: 1px solid #e9e9f5;
}

._1l {
    border-bottom: 1px solid #ececec;
}

._2il {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 16px;
    color: #44444480;
}

._2il ._2im {
    font-size: 0.75rem;
}

.padding-md {
    padding: 16px !important;
}

._2iw {
    margin-bottom: 8px;
    min-height: 20px;
    line-height: 20px;
}

._0 {
    font-size: 0.75rem;
    line-height: 1;
    text-transform: uppercase;
    color: #44444480;
}

._2qq:last-child {
    margin-bottom: 0;
}

._1m li {
    list-style-type: none;
}

._2qq {
    display: flex;
    align-items: center;
    padding: 8px;
    margin-bottom: 4px;
    background-color: #f5f6f6;
    border-radius: 4px;
}

._2qq ._2qr {
    margin-right: 0.5em;
    width: 32px;
    height: 32px;
    object-fit: cover;
}

._2qq ._2qs {
    font-weight: 400;
    flex-grow: 1;
    word-break: break-word;
}

._2il ._2in:last-of-type {
    padding-right: 0;
}

._2il ._2in {
    padding-left: 0.5em;
    padding-right: 0.5em;
    font-size: 0.875rem;
    font-weight: 600;
    color: #444;
}

.upgrade_package {
    padding: 7px 14px;
    background-color: rgb(255, 170, 0) !important;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    border-radius: 100vh;
    margin-left: 8px;
}

.upgrade_package:hover {
    color: #fff !important;
}

h1._2 {
    -webkit-font-smoothing: antialiased;
    font-size: 1.375rem;
    font-weight: 700;
    color: #1c1e36;
    margin-bottom: 0;
}

.main-download {
    align-self: center;
    max-width: 1200px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
    flex-grow: 1;
}

._by {
    background-color: #fff;
    border-radius: 16px;
    box-shadow: 0 4.10592px 8.21184px #00000005;
    padding: 16px 16px 18px 16px;
}

._by h6,
._by .form-group label {
    margin-bottom: 8px;
    font-size: 13px;
    color: #44444480;
    font-family: Inter, Noto Sans, sans-serif;
    font-weight: 500;
}

._by input[name='new-creative-name'] {
    background-color: #f5f6f6;
    box-shadow: none;
    outline: none;
    border: none;
    color: #444;
    height: auto;
    padding: 8px;
    font-size: 0.875rem;
    line-height: 1rem;
}

._by select[name='new-creative-version'] {
    background-color: #f5f6f6;
    box-shadow: none;
    outline: none;
    border: none;
    color: #444;
    height: auto;
    padding: 8px;
    font-size: 0.875rem;
    line-height: 1rem;
}

.margin-bottom-xl {
    margin-bottom: 24px !important;
}

.creative-versions-list {
    flex-grow: 1;
    flex-shrink: 0;
    margin-top: 16px;
}

._2q3 {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
    max-width: 100%;
}

._2q4 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

._2q4 h2 {
    display: flex;
    align-items: center;
    margin: 0;
    font-size: 1rem;
    font-family: Inter, Noto Sans, sans-serif;
    font-weight: 500;
}

._2q6 {
    display: flex;
    flex-wrap: nowrap;
    column-gap: 8px;
}

._5m {
    display: inline-flex;
    align-items: center;
}

._jf._jh {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

._jh {
    white-space: pre;
}

._jf {
    height: 100%;
    width: 100%;
}

._jh ._jp {
    width: 72px;
    height: 72px;
    fill: #f9f9fb;
    margin-bottom: 8px;
}

.button_upload_file {
    height: 36px;
    padding: 10px 15px;
    line-height: 1rem;
    display: inline-flex;
    align-items: center;
    box-shadow: none;
    border: none;
    background-color: #a469fb;
    border-radius: 100vh;
    color: #fff;
}

.text_upload_file {
    -webkit-font-smoothing: antialiased;
    font-family: Inter, Noto Sans, sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: normal;
}

.button_upload_file .material-icons {
    fill: #fff;
    vertical-align: text-top;
    margin-right: 4px;
}

.text_drag {
    -webkit-font-smoothing: antialiased;
    font-family: Inter, Noto Sans, sans-serif;
    font-weight: 600;
    color: #1c1e36;
}

.text_zip {
    -webkit-font-smoothing: antialiased;
    font-family: Inter, Noto Sans, sans-serif;
    font-weight: 400;
    font-size: 0.875rem;
    line-height: 17px;
}

.box_upload_content {
    padding: 80px 0;
}

.list_c6 {
    flex: 1 0 100%;
    display: flex;
    flex-direction: column;
    row-gap: 4px;
    margin: 0;
    padding: 0;
}

._mj {
    display: grid;
    /* grid-template-columns: [checkbox-column] 34px [thumbnail-column] 40px [name-column] minmax(5em, 18%) [tags-column] auto [language-column] 120px [controls-column] 45px; */
    grid-template-columns: [checkbox-column] 34px [thumbnail-column] 40px [name-column] minmax(5em, 80%) [controls-column] 45px;
}

._m7 {
    display: grid;
    grid-column-gap: 8px;
    height: 60px;
    border-radius: 12px;
    background-color: #fff;
}

._mf {
    padding-left: 16px;
    padding-right: 2px;
}

._m9 {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    white-space: nowrap;
    border-radius: inherit;
}

._1v,
._1v.material-icons {
    width: 1.2rem;
    height: 1.2rem;
    cursor: pointer;
}

._1y.material-icons {
    fill: #22ae7c;
}

._c4:not(._c5) ._c7 {
    display: none;
}

.toggle-template .switch-wrap {
    min-width: 40px;
    height: 26px;
    margin: 0 4px;
}

.toggle-template .switcher {
    min-width: 40px !important;
    height: 24px !important;
    margin: 0 4px !important;
    padding: 0 15px 0 30px !important;
}

.toggle-template .switcher:before {
    width: 16px !important;
    height: 16px !important;
}

.toggle-template .switch-wrap input:checked+.switcher {
    padding: 0 15px 0 30px !important;
}

.preview-device.device-iphoneX {
    transform: translate(-50%);
    transform-origin: 0 0;
    left: 50%;
    width: 361.2096756884px;
    height: 734.2057395143px;
}

.preview-device {
    position: relative;
    margin: 1.5rem 0;
    padding: 18px;
}

.preview-device .device-container {
    position: relative;
    width: 100%;
    height: 100%;
}

.preview-device.device-iphoneX .device-body {
    background-image: url('../images/iphonex.svg');
    border: none;
    box-shadow: none;
}

.preview-device .device-body {
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%) translateY(-50%);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    filter: drop-shadow(0 8px 20px rgba(0, 0, 0, 0.1));
    z-index: 3;
    pointer-events: none;
    border: 18px solid white;
    border-radius: 45px;
    box-shadow: #00000012;
}

.preview-device .splash {
    z-index: 1;
}

._52._53 {
    position: absolute;
    inset: 0;
}

._52 {
    background-color: #1c1e36;
    display: flex;
    align-items: center;
    justify-content: center;
}

.preview-logo {
    text-align: center;
}

.preview-logo img {
    width: 100px;
}

.preview-title {
    margin-top: 130px;
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    text-align: center;
}

.mright-38 {
    margin-right: 38px;
}

@media (max-width: 991px) {
    .navbar-expand-lg .navbar-brand img {
        height: 30px;
        object-fit: contain;
    }
}

@media (max-width: 1240px) {
    ._my {
        min-width: 350px !important;
    }
}

@media (max-width: 1050px) {
    ._my {
        display: none !important;
    }

    .navbar-user a {
        display: none !important;
    }
}

@media (max-width: 992px) {
    .upgrade_package {
        margin-top: 10px;
    }

    .user_plan {
        line-height: 30px;
    }
}

@media (max-width: 992px) {
    .card_table {
        overflow-x: auto;
    }

    ::-webkit-scrollbar {
        height: 4px;
        width: 4px;
        background: gray;
    }

    ::-webkit-scrollbar-thumb:horizontal {
        background: #d4d5de;
        border-radius: 10px;
    }
}

.no_sale {
    margin-top: 15px !important;
}

.is_sale .pricing-1-table {
    border: solid 2px #8d5ae2;
    border-radius: 24px;
    box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.1);
    padding: 43px 15px 55px;
}

.btn_pricing {
    width: 90%;
    height: 41px;
    border-radius: 8px;
    border: solid 1px #0af;
    font-size: 15px;
    font-weight: 700;
    color: #0af;
    margin: 0 auto !important;
    padding: 4px 8px !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn_pricing_calculation {
    border: solid 1px #f15a28 !important;
    color: #f15a28 !important;
}

.btn_pricing:hover {
    color: #008fdf !important;
}

.btn_pricing_calculation:hover {
    color: #f06a3d !important;
}

.btn_pricing_sale {
    background-color: #0af !important;
    color: #fff !important;
}

.btn_pricing_sale:hover {
    background-color: #008fdf !important;
    color: #fff !important;
}

.btn_calculation {
    background-color: #f15a28 !important;
    border-color: #f15a28 !important;
    color: #fff !important;
}

.btn_calculation:hover {
    background-color: #f15a28 !important;
    border-color: #f15a28 !important;
    color: #fff !important;
}

.plan-ribbon {
    position: absolute;
    top: 2px;
    right: 9px;
    overflow: hidden;
    height: 128px;
    width: 128px;
}

.plan-ribbon .ribbon {
    position: absolute;
    width: 363px;
    height: 45px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.07), 0 5px 10px -5px rgba(0, 0, 0, 0.15);
    background-image: linear-gradient(90deg, #af67ff 40%, #6066f6 65%);
    transform: translate(-110px, 8px) rotate(45deg);
    text-align: center;
}

.plan-ribbon .ribbon-icon {
    position: absolute;
    top: 21px;
    left: 64px;
    width: 45px;
}

.is_sale {
    position: relative;
}

.highlighted {
    /* border-right: solid 2px #8d5ae2;
    border-left: solid 2px #8d5ae2; */
}

.column-header {
    /* border-top: solid 2px #8d5ae2 !important;
    border-right: solid 2px #8d5ae2 !important;
    border-left: solid 2px #8d5ae2 !important;
    border-radius: 15px 15px 0 0 !important; */
}

.section__price .price {
    height: 47px;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.29;
    letter-spacing: -0.34px;
    color: #3d474d;
}

.section__price .recurrence {
    font-size: 13px;
    color: #8a9499;
}

.section__price {
    height: 44px;
    margin-top: 36px;
    margin-bottom: 10px;
}

.table-responsive.table-pricing {
    overflow-x: visible !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

.btn_pricing_end {
    width: 80%;
}

@media (min-width: 992px) {
    .navbar-vertical.navbar-expand-lg.show {
        max-width: 221px;
        border-radius: 0;
        width: 221px;
        position: fixed;
    }

    /* Chỉ offset khi sidebar cũ (fixed). Layout mới dùng flex, không margin thêm. */
    .navbar-vertical.navbar-expand-lg.show + .main-build,
    .navbar-vertical.navbar-expand-lg.show ~ .main-build {
        margin-left: 221px;
    }
}

.main-build .comp-table .table-responsive tbody tr {
    background: transparent !important;
}

.btn_started:hover {
    color: #fff !important;
    background-color: #f76a3b !important;
    border-color: #f76a3b !important;
}

.title_why {
    height: 52px !important;
}

.btn_upgrade_popup {
    background-color: #a469fb !important;
    border-color: #a469fb !important;
}

.btn_upgrade_popup:hover {
    color: #fff !important;
    background-color: #9252f1 !important;
}

.mtop-15 {
    margin-top: 4rem !important;
}

.upgrade_required {
    font-size: 15px !important;
}

.gradient-text {
    background: #1d1d1f;
    background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    background-image: linear-gradient(108deg, #0894ff, #c959dd 34%, #ff2e54 68%, #ff9004);
}

.coming_soon {
    color: #8c8fa6 !important;
}

.notification_app {
    background: #1c1e36;
    border-radius: 10px;
    padding: 0 20px;
    color: #fff;
    -webkit-animation: my 700ms infinite;
    -moz-animation: my 700ms infinite;
    -o-animation: my 700ms infinite;
    animation: my 700ms infinite;
    display: flex;
    justify-content: center;
}

#buyButton {
    background: #f8cd0a !important;
    color: #000 !important;
    font-weight: bold !important;
}

@-webkit-keyframes my {
    0% {
        color: #f8cd0a;
    }

    50% {
        color: #fff;
    }

    100% {
        color: #f8cd0a;
    }
}

@-moz-keyframes my {
    0% {
        color: #f8cd0a;
    }

    50% {
        color: #fff;
    }

    100% {
        color: #f8cd0a;
    }
}

@-o-keyframes my {
    0% {
        color: #f8cd0a;
    }

    50% {
        color: #fff;
    }

    100% {
        color: #f8cd0a;
    }
}

@keyframes my {
    0% {
        color: #f8cd0a;
    }

    50% {
        color: #fff;
    }

    100% {
        color: #f8cd0a;
    }
}

.blog-page-section {
    padding: 30px 40px;
}

.markdown {
    --ifm-h1-vertical-rhythm-top: 3;
    --ifm-h2-vertical-rhythm-top: 2;
    --ifm-h3-vertical-rhythm-top: 1.5;
    --ifm-heading-vertical-rhythm-top: 1.25;
    --ifm-h1-vertical-rhythm-bottom: 1.25;
    --ifm-heading-vertical-rhythm-bottom: 1;
}

.markdown>h2,
.markdown>h3,
.markdown>h4,
.markdown>h5,
.markdown>h6 {
    margin-bottom: 15px;
}

.markdown p,
.markdown pre,
.markdown ul,
.tabList__CuJ {
    margin-bottom: 1.25rem;
}

.markdown>h2 {
    --ifm-h2-font-size: 2rem;
    margin-top: 15px;
}

.markdown>h3 {
    --ifm-h3-font-size: 1.5rem;
    margin-top: 15px;
}

.blog-page-section p {
    margin-bottom: 1.25rem;
}

:root {
    --ifm-color-scheme: light;
    --ifm-dark-value: 10%;
    --ifm-darker-value: 15%;
    --ifm-darkest-value: 30%;
    --ifm-light-value: 15%;
    --ifm-lighter-value: 30%;
    --ifm-lightest-value: 50%;
    --ifm-contrast-background-value: 90%;
    --ifm-contrast-foreground-value: 70%;
    --ifm-contrast-background-dark-value: 70%;
    --ifm-contrast-foreground-dark-value: 90%;
    --ifm-color-primary: #3578e5;
    --ifm-color-secondary: #ebedf0;
    --ifm-color-success: #00a400;
    --ifm-color-info: #54c7ec;
    --ifm-color-warning: #ffba00;
    --ifm-color-danger: #fa383e;
    --ifm-color-primary-dark: #306cce;
    --ifm-color-primary-darker: #2d66c3;
    --ifm-color-primary-darkest: #2554a0;
    --ifm-color-primary-light: #538ce9;
    --ifm-color-primary-lighter: #72a1ed;
    --ifm-color-primary-lightest: #9abcf2;
    --ifm-color-primary-contrast-background: #ebf2fc;
    --ifm-color-primary-contrast-foreground: #102445;
    --ifm-color-secondary-dark: #d4d5d8;
    --ifm-color-secondary-darker: #c8c9cc;
    --ifm-color-secondary-darkest: #a4a6a8;
    --ifm-color-secondary-light: #eef0f2;
    --ifm-color-secondary-lighter: #f1f2f5;
    --ifm-color-secondary-lightest: #f5f6f8;
    --ifm-color-secondary-contrast-background: #fdfdfe;
    --ifm-color-secondary-contrast-foreground: #474748;
    --ifm-color-success-dark: #009400;
    --ifm-color-success-darker: #008b00;
    --ifm-color-success-darkest: #007300;
    --ifm-color-success-light: #26b226;
    --ifm-color-success-lighter: #4dbf4d;
    --ifm-color-success-lightest: #80d280;
    --ifm-color-success-contrast-background: #e6f6e6;
    --ifm-color-success-contrast-foreground: #003100;
    --ifm-color-info-dark: #4cb3d4;
    --ifm-color-info-darker: #47a9c9;
    --ifm-color-info-darkest: #3b8ba5;
    --ifm-color-info-light: #6ecfef;
    --ifm-color-info-lighter: #87d8f2;
    --ifm-color-info-lightest: #aae3f6;
    --ifm-color-info-contrast-background: #eef9fd;
    --ifm-color-info-contrast-foreground: #193c47;
    --ifm-color-warning-dark: #e6a700;
    --ifm-color-warning-darker: #d99e00;
    --ifm-color-warning-darkest: #b38200;
    --ifm-color-warning-light: #ffc426;
    --ifm-color-warning-lighter: #ffcf4d;
    --ifm-color-warning-lightest: #ffdd80;
    --ifm-color-warning-contrast-background: #fff8e6;
    --ifm-color-warning-contrast-foreground: #4d3800;
    --ifm-color-danger-dark: #e13238;
    --ifm-color-danger-darker: #d53035;
    --ifm-color-danger-darkest: #af272b;
    --ifm-color-danger-light: #fb565b;
    --ifm-color-danger-lighter: #fb7478;
    --ifm-color-danger-lightest: #fd9c9f;
    --ifm-color-danger-contrast-background: #ffebec;
    --ifm-color-danger-contrast-foreground: #4b1113;
    --ifm-color-white: #fff;
    --ifm-color-black: #000;
    --ifm-color-gray-0: var(--ifm-color-white);
    --ifm-color-gray-100: #f5f6f7;
    --ifm-color-gray-200: #ebedf0;
    --ifm-color-gray-300: #dadde1;
    --ifm-color-gray-400: #ccd0d5;
    --ifm-color-gray-500: #bec3c9;
    --ifm-color-gray-600: #8d949e;
    --ifm-color-gray-700: #606770;
    --ifm-color-gray-800: #444950;
    --ifm-color-gray-900: #1c1e21;
    --ifm-color-gray-1000: var(--ifm-color-black);
    --ifm-color-emphasis-0: var(--ifm-color-gray-0);
    --ifm-color-emphasis-100: var(--ifm-color-gray-100);
    --ifm-color-emphasis-200: var(--ifm-color-gray-200);
    --ifm-color-emphasis-300: var(--ifm-color-gray-300);
    --ifm-color-emphasis-400: var(--ifm-color-gray-400);
    --ifm-color-emphasis-600: var(--ifm-color-gray-600);
    --ifm-color-emphasis-700: var(--ifm-color-gray-700);
    --ifm-color-emphasis-800: var(--ifm-color-gray-800);
    --ifm-color-emphasis-900: var(--ifm-color-gray-900);
    --ifm-color-emphasis-1000: var(--ifm-color-gray-1000);
    --ifm-color-content: var(--ifm-color-emphasis-900);
    --ifm-color-content-inverse: var(--ifm-color-emphasis-0);
    --ifm-color-content-secondary: #525860;
    --ifm-background-color: #0000;
    --ifm-background-surface-color: var(--ifm-color-content-inverse);
    --ifm-global-border-width: 1px;
    --ifm-global-radius: 0.4rem;
    --ifm-hover-overlay: #0000000d;
    --ifm-font-color-base: var(--ifm-color-content);
    --ifm-font-color-base-inverse: var(--ifm-color-content-inverse);
    --ifm-font-color-secondary: var(--ifm-color-content-secondary);
    --ifm-font-family-base: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
    --ifm-font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
    --ifm-font-size-base: 100%;
    --ifm-font-weight-light: 300;
    --ifm-font-weight-normal: 400;
    --ifm-font-weight-semibold: 500;
    --ifm-font-weight-bold: 700;
    --ifm-font-weight-base: var(--ifm-font-weight-normal);
    --ifm-line-height-base: 1.65;
    --ifm-global-spacing: 1rem;
    --ifm-spacing-vertical: var(--ifm-global-spacing);
    --ifm-spacing-horizontal: var(--ifm-global-spacing);
    --ifm-transition-fast: 200ms;
    --ifm-transition-slow: 400ms;
    --ifm-transition-timing-default: cubic-bezier(0.08, 0.52, 0.52, 1);
    --ifm-global-shadow-lw: 0 1px 2px 0 #0000001a;
    --ifm-global-shadow-md: 0 5px 40px #0003;
    --ifm-global-shadow-tl: 0 12px 28px 0 #0003, 0 2px 4px 0 #0000001a;
    --ifm-z-index-dropdown: 100;
    --ifm-z-index-fixed: 200;
    --ifm-z-index-overlay: 400;
    --ifm-container-width: 1140px;
    --ifm-container-width-xl: 1320px;
    --ifm-code-background: #f6f7f8;
    --ifm-code-border-radius: var(--ifm-global-radius);
    --ifm-code-font-size: 90%;
    --ifm-code-padding-horizontal: 0.1rem;
    --ifm-code-padding-vertical: 0.1rem;
    --ifm-pre-background: var(--ifm-code-background);
    --ifm-pre-border-radius: var(--ifm-code-border-radius);
    --ifm-pre-color: inherit;
    --ifm-pre-line-height: 1.45;
    --ifm-pre-padding: 1rem;
    --ifm-heading-color: inherit;
    --ifm-heading-margin-top: 0;
    --ifm-heading-margin-bottom: var(--ifm-spacing-vertical);
    --ifm-heading-font-family: var(--ifm-font-family-base);
    --ifm-heading-font-weight: var(--ifm-font-weight-bold);
    --ifm-heading-line-height: 1.25;
    --ifm-h1-font-size: 2rem;
    --ifm-h2-font-size: 1.5rem;
    --ifm-h3-font-size: 1.25rem;
    --ifm-h4-font-size: 1rem;
    --ifm-h5-font-size: 0.875rem;
    --ifm-h6-font-size: 0.85rem;
    --ifm-image-alignment-padding: 1.25rem;
    --ifm-leading-desktop: 1.25;
    --ifm-leading: calc(var(--ifm-leading-desktop) * 1rem);
    --ifm-list-left-padding: 2rem;
    --ifm-list-margin: 1rem;
    --ifm-list-item-margin: 0.25rem;
    --ifm-list-paragraph-margin: 1rem;
    --ifm-table-cell-padding: 0.75rem;
    --ifm-table-background: #0000;
    --ifm-table-stripe-background: #00000008;
    --ifm-table-border-width: 1px;
    --ifm-table-border-color: var(--ifm-color-emphasis-300);
    --ifm-table-head-background: inherit;
    --ifm-table-head-color: inherit;
    --ifm-table-head-font-weight: var(--ifm-font-weight-bold);
    --ifm-table-cell-color: inherit;
    --ifm-link-color: var(--ifm-color-primary);
    --ifm-link-decoration: none;
    --ifm-link-hover-color: var(--ifm-link-color);
    --ifm-link-hover-decoration: underline;
    --ifm-paragraph-margin-bottom: var(--ifm-leading);
    --ifm-blockquote-font-size: var(--ifm-font-size-base);
    --ifm-blockquote-border-left-width: 2px;
    --ifm-blockquote-padding-horizontal: var(--ifm-spacing-horizontal);
    --ifm-blockquote-padding-vertical: 0;
    --ifm-blockquote-shadow: none;
    --ifm-blockquote-color: var(--ifm-color-emphasis-800);
    --ifm-blockquote-border-color: var(--ifm-color-emphasis-300);
    --ifm-hr-background-color: var(--ifm-color-emphasis-500);
    --ifm-hr-height: 1px;
    --ifm-hr-margin-vertical: 1.5rem;
    --ifm-scrollbar-size: 7px;
    --ifm-scrollbar-track-background-color: #f1f1f1;
    --ifm-scrollbar-thumb-background-color: silver;
    --ifm-scrollbar-thumb-hover-background-color: #a7a7a7;
    --ifm-alert-background-color: inherit;
    --ifm-alert-border-color: inherit;
    --ifm-alert-border-radius: var(--ifm-global-radius);
    --ifm-alert-border-width: 0px;
    --ifm-alert-border-left-width: 5px;
    --ifm-alert-color: var(--ifm-font-color-base);
    --ifm-alert-padding-horizontal: var(--ifm-spacing-horizontal);
    --ifm-alert-padding-vertical: var(--ifm-spacing-vertical);
    --ifm-alert-shadow: var(--ifm-global-shadow-lw);
    --ifm-avatar-intro-margin: 1rem;
    --ifm-avatar-intro-alignment: inherit;
    --ifm-avatar-photo-size: 3rem;
    --ifm-badge-background-color: inherit;
    --ifm-badge-border-color: inherit;
    --ifm-badge-border-radius: var(--ifm-global-radius);
    --ifm-badge-border-width: var(--ifm-global-border-width);
    --ifm-badge-color: var(--ifm-color-white);
    --ifm-badge-padding-horizontal: calc(var(--ifm-spacing-horizontal) * 0.5);
    --ifm-badge-padding-vertical: calc(var(--ifm-spacing-vertical) * 0.25);
    --ifm-breadcrumb-border-radius: 1.5rem;
    --ifm-breadcrumb-spacing: 0.5rem;
    --ifm-breadcrumb-color-active: var(--ifm-color-primary);
    --ifm-breadcrumb-item-background-active: var(--ifm-hover-overlay);
    --ifm-breadcrumb-padding-horizontal: 0.8rem;
    --ifm-breadcrumb-padding-vertical: 0.4rem;
    --ifm-breadcrumb-size-multiplier: 1;
    --ifm-breadcrumb-separator: url(data:image/svg + xml;utf8, <svgxmlns='http://www.w3.org/2000/svg'x='0px'y='0px'viewBox='0 0 256 256'><g><g><polygonpoints='79.093,0 48.907,30.187 146.72,128 48.907,225.813 79.093,256 207.093,128'/></g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g></svgxmlns=>);
    --ifm-breadcrumb-separator-filter: none;
    --ifm-breadcrumb-separator-size: 0.5rem;
    --ifm-breadcrumb-separator-size-multiplier: 1.25;
    --ifm-button-background-color: inherit;
    --ifm-button-border-color: var(--ifm-button-background-color);
    --ifm-button-border-width: var(--ifm-global-border-width);
    --ifm-button-font-weight: var(--ifm-font-weight-bold);
    --ifm-button-padding-horizontal: 1.5rem;
    --ifm-button-padding-vertical: 0.375rem;
    --ifm-button-size-multiplier: 1;
    --ifm-button-transition-duration: var(--ifm-transition-fast);
    --ifm-button-border-radius: calc(var(--ifm-global-radius) * var(--ifm-button-size-multiplier));
    --ifm-button-group-spacing: 2px;
    --ifm-card-background-color: var(--ifm-background-surface-color);
    --ifm-card-border-radius: calc(var(--ifm-global-radius) * 2);
    --ifm-card-horizontal-spacing: var(--ifm-global-spacing);
    --ifm-card-vertical-spacing: var(--ifm-global-spacing);
    --ifm-toc-border-color: var(--ifm-color-emphasis-300);
    --ifm-toc-link-color: var(--ifm-color-content-secondary);
    --ifm-toc-padding-vertical: 0.5rem;
    --ifm-toc-padding-horizontal: 0.5rem;
    --ifm-dropdown-background-color: var(--ifm-background-surface-color);
    --ifm-dropdown-font-weight: var(--ifm-font-weight-semibold);
    --ifm-dropdown-link-color: var(--ifm-font-color-base);
    --ifm-dropdown-hover-background-color: var(--ifm-hover-overlay);
    --ifm-footer-background-color: var(--ifm-color-emphasis-100);
    --ifm-footer-color: inherit;
    --ifm-footer-link-color: var(--ifm-color-emphasis-700);
    --ifm-footer-link-hover-color: var(--ifm-color-primary);
    --ifm-footer-link-horizontal-spacing: 0.5rem;
    --ifm-footer-padding-horizontal: calc(var(--ifm-spacing-horizontal) * 2);
    --ifm-footer-padding-vertical: calc(var(--ifm-spacing-vertical) * 2);
    --ifm-footer-title-color: inherit;
    --ifm-footer-logo-max-width: min(30rem, 90vw);
    --ifm-hero-background-color: var(--ifm-background-surface-color);
    --ifm-hero-text-color: var(--ifm-color-emphasis-800);
    --ifm-menu-color: var(--ifm-color-emphasis-700);
    --ifm-menu-color-active: var(--ifm-color-primary);
    --ifm-menu-color-background-active: var(--ifm-hover-overlay);
    --ifm-menu-color-background-hover: var(--ifm-hover-overlay);
    --ifm-menu-link-padding-horizontal: 0.75rem;
    --ifm-menu-link-padding-vertical: 0.375rem;
    --ifm-menu-link-sublist-icon: url(data:image/svg + xml;utf8, <svgxmlns='http://www.w3.org/2000/svg'width='16px'height='16px'viewBox='0 0 24 24'><pathfill='rgba(0,0,0,0.5)'d=' M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z'></pathfill=></svg>);
 --ifm-menu-link-sublist-icon-filter: none;
    --ifm-navbar-background-color: var(--ifm-background-surface-color);
    --ifm-navbar-height: 3.75rem;
    --ifm-navbar-item-padding-horizontal: 0.75rem;
    --ifm-navbar-item-padding-vertical: 0.25rem;
    --ifm-navbar-link-color: var(--ifm-font-color-base);
    --ifm-navbar-link-active-color: var(--ifm-link-color);
    --ifm-navbar-padding-horizontal: var(--ifm-spacing-horizontal);
    --ifm-navbar-padding-vertical: calc(var(--ifm-spacing-vertical) * 0.5);
    --ifm-navbar-shadow: var(--ifm-global-shadow-lw);
    --ifm-navbar-search-input-background-color: var(--ifm-color-emphasis-200);
    --ifm-navbar-search-input-color: var(--ifm-color-emphasis-800);
    --ifm-navbar-search-input-placeholder-color: var(--ifm-color-emphasis-500);
    --ifm-navbar-search-input-icon: url(data:image/svg + xml;utf8, <svgfill='currentColor'xmlns='http://www.w3.org/2000/svg'viewBox='0 0 16 16'height='16px'width='16px'><pathd='M6.02945,10.20327a4.17382,4.17382,0,1,1,4.17382-4.17382A4.15609,4.15609,0,0,1,6.02945,10.20327Zm9.69195,4.2199L10.8989,9.59979A5.88021,5.88021,0,0,0,12.058,6.02856,6.00467,6.00467,0,1,0,9.59979,10.8989l4.82338,4.82338a.89729.89729,0,0,0,1.29912,0,.89749.89749,0,0,0-.00087-1.29909Z'/></svgfill=>);
    --ifm-navbar-sidebar-width: 83vw;
    --ifm-pagination-border-radius: var(--ifm-global-radius);
    --ifm-pagination-color-active: var(--ifm-color-primary);
    --ifm-pagination-font-size: 1rem;
    --ifm-pagination-item-active-background: var(--ifm-hover-overlay);
    --ifm-pagination-page-spacing: 0.2em;
    --ifm-pagination-padding-horizontal: calc(var(--ifm-spacing-horizontal) * 1);
    --ifm-pagination-padding-vertical: calc(var(--ifm-spacing-vertical) * 0.25);
    --ifm-pagination-nav-border-radius: var(--ifm-global-radius);
    --ifm-pagination-nav-color-hover: var(--ifm-color-primary);
    --ifm-pills-color-active: var(--ifm-color-primary);
    --ifm-pills-color-background-active: var(--ifm-hover-overlay);
    --ifm-pills-spacing: 0.125rem;
    --ifm-tabs-color: var(--ifm-font-color-secondary);
    --ifm-tabs-color-active: var(--ifm-color-primary);
    --ifm-tabs-color-active-border: var(--ifm-tabs-color-active);
    --ifm-tabs-padding-horizontal: 1rem;
    --ifm-tabs-padding-vertical: 1rem;
    --docusaurus-progress-bar-color: var(--ifm-color-primary);
    --ifm-color-primary: #a469fc;
    --ifm-navbar-height: 100px;
    --scroll-speed: 5s;
    --docusaurus-tag-list-border: var(--ifm-color-emphasis-300);
    --docusaurus-announcement-bar-height: auto;
    --docusaurus-collapse-button-bg: #0000;
    --docusaurus-collapse-button-bg-hover: #0000001a;
    --doc-sidebar-width: 300px;
    --doc-sidebar-hidden-width: 30px;
}

.alert {
    --ifm-code-background: var(--ifm-alert-background-color-highlight);
    --ifm-link-color: var(--ifm-alert-foreground-color);
    --ifm-link-hover-color: var(--ifm-alert-foreground-color);
    --ifm-link-decoration: underline;
    --ifm-tabs-color: var(--ifm-alert-foreground-color);
    --ifm-tabs-color-active: var(--ifm-alert-foreground-color);
    --ifm-tabs-color-active-border: var(--ifm-alert-border-color);
    background-color: var(--ifm-alert-background-color);
    border: var(--ifm-alert-border-width) solid var(--ifm-alert-border-color);
    border-left-width: var(--ifm-alert-border-left-width);
    border-radius: var(--ifm-alert-border-radius);
    box-shadow: var(--ifm-alert-shadow);
    padding: var(--ifm-alert-padding-vertical) var(--ifm-alert-padding-horizontal);
}

.alert--secondary {
    --ifm-alert-background-color: var(--ifm-color-secondary-contrast-background);
    --ifm-alert-background-color-highlight: #ebedf026;
    --ifm-alert-foreground-color: var(--ifm-color-secondary-contrast-foreground);
    --ifm-alert-border-color: var(--ifm-color-secondary-dark);
}

.alert,
.alert .close {
    color: var(--ifm-alert-foreground-color);
}

.admonitionHeading_tbUL {
    font: var(--ifm-heading-font-weight) var(--ifm-h5-font-size) / var(--ifm-heading-line-height) var(--ifm-heading-font-family);
    margin-bottom: 0.3rem;
}

.admonitionIcon_kALy svg {
    fill: var(--ifm-alert-foreground-color);
    display: inline-block;
    height: 1.6em;
    width: 1.6em;
}

.tableOfContents {
    /* max-height: calc(100vh - var(--ifm-navbar-height) - 2rem); */
    overflow-y: auto;
    position: fixed;
    /* top: calc(var(--ifm-navbar-height) + 1rem); */
}

.table-of-contents__left-border {
    border-left: 1px solid var(--ifm-toc-border-color);
    padding-left: 10px;
}

.table-of-contents li {
    margin: var(--ifm-toc-padding-vertical) var(--ifm-toc-padding-horizontal);
}

.table-of-contents__link {
    color: var(--ifm-toc-link-color);
    display: block;
}

.menu_docs aside {
    position: fixed;
    height: 100%;
    overflow: auto;
    width: 200px;
}

.menu_docs ul li label i:first-child {
    color: rgb(119, 119, 119);
}

.menu_docs input[name='menu'],
.menu_docs input[name='dropdowns'] {
    display: none;
}

.menu_docs input[type='radio']:checked~label {
    color: rgb(124, 179, 66);
}

.menu_docs input[type='radio']:checked~label>i:first-child {
    color: rgb(124, 179, 66);
}

.menu_docs input:not(checked)~label {
    color: rgb(60, 33, 33);
}

.menu_docs input[type='checkbox']:checked~ul {
    display: block;
}

.menu_docs #uparrow,
.menu_docs #downarrow {
    float: right;
}

.menu_docs input[name='dropdowns']:checked~label>#downarrow {
    display: none;
}

.menu_docs input[name='dropdowns']:checked~label>#uparrow {
    display: inline-block;
}

.menu_docs input[name='dropdowns']:not(checked)~label>#uparrow {
    display: none;
}

.menu_docs ul li {
    font-size: 15px;
    font-weight: 600;
    margin-top: 12px;
    text-transform: capitalize;
}

.menu_docs ul li label i {
    width: 50px;
    margin-right: 5px;
    text-align: center;
    margin-top: 5px;
}

.menu_docs ul li label {
    display: inline-block;
    width: 100%;
}

.menu_docs ul li label .active {
    color: #a469fb;
}

.menu_docs ul li label:hover {
    cursor: pointer;
}

.menu_docs .main {
    list-style-type: none;
    padding-left: 0;
    border-right: 1px solid var(--ifm-toc-border-color);
}

.menu_docs .drop {
    display: block;
}

.menu_docs .drop li {
    display: block;
    font-size: 14px;
    padding-left: 20px;
}

.menu_docs nav {
    background: rgb(24, 117, 209);
    height: 50px;
    margin-left: 265px;
}

.menu_docs .main a {
    color: #242424;
}

.alert--danger {
    --ifm-alert-background-color: var(--ifm-color-danger-contrast-background);
    --ifm-alert-background-color-highlight: #fa383e26;
    --ifm-alert-foreground-color: var(--ifm-color-danger-contrast-foreground);
    --ifm-alert-border-color: var(--ifm-color-danger-dark);
}

.alert--info {
    --ifm-alert-background-color: var(--ifm-color-info-contrast-background);
    --ifm-alert-background-color-highlight: #54c7ec26;
    --ifm-alert-foreground-color: var(--ifm-color-info-contrast-foreground);
    --ifm-alert-border-color: var(--ifm-color-info-dark);
}

.alert--success {
    --ifm-alert-background-color: var(--ifm-color-success-contrast-background);
    --ifm-alert-background-color-highlight: #00a40026;
    --ifm-alert-foreground-color: var(--ifm-color-success-contrast-foreground);
    --ifm-alert-border-color: var(--ifm-color-success-dark);
}

.alert--secondary {
    --ifm-alert-background-color: var(--ifm-color-secondary-contrast-background);
    --ifm-alert-background-color-highlight: #ebedf026;
    --ifm-alert-foreground-color: var(--ifm-color-secondary-contrast-foreground);
    --ifm-alert-border-color: var(--ifm-color-secondary-dark);
}

.alert--warning {
    --ifm-alert-background-color: var(--ifm-color-warning-contrast-background);
    --ifm-alert-background-color-highlight: #ffba0026;
    --ifm-alert-foreground-color: var(--ifm-color-warning-contrast-foreground);
    --ifm-alert-border-color: var(--ifm-color-warning-dark);
}

.alert--danger {
    border-left: 3px solid var(--ifm-alert-border-color) !important;
}

.alert--success {
    border-left: 3px solid var(--ifm-alert-border-color) !important;
}

.alert--info {
    border-left: 3px solid var(--ifm-alert-border-color) !important;
}

.alert--secondary {
    border-left: 3px solid var(--ifm-alert-border-color) !important;
}

.alert--warning {
    border-left: 3px solid var(--ifm-alert-border-color) !important;
}

.markdown h1:first-child {
    --ifm-h1-font-size: 3rem;
    margin-bottom: calc(var(--ifm-h1-vertical-rhythm-bottom) * var(--ifm-leading));
}

.single-post-txt {
    font-size: 15px;
    padding: 0 18px;
    margin-top: 12px;
}

.single-post-txt h2 {
    margin-bottom: 10px;
    margin-top: 20px;
}

.single-post-txt h3,
.single-post-txt img {
    margin-bottom: 10px;
    margin-top: 10px;
}

.single-post-txt div {
    margin-bottom: 5px;
}

.table-of-contents__left-border {
    font-size: 14px;
    position: fixed;
    margin-top: 12px;
}

.single-post-txt img {
    max-width: 80%;
}

.single-post-txt td,
.single-post-txt th,
.single-post-txt tr {
    border: 1px solid #ccc;
}

.single-post-txt table {
    width: 100%;
}

.single-post-txt table td,
.single-post-txt table th {
    border: var(--ifm-table-border-width) solid var(--ifm-table-border-color);
    padding: var(--ifm-table-cell-padding);
}

.menu_page_docs {
    background-color: #1c1e36 !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    -webkit-box-shadow: 0 2px 3px rgba(96, 96, 96, 0.1);
    -moz-box-shadow: 0 2px 3px rgba(96, 96, 96, 0.1);
    box-shadow: 0 2px 3px rgba(96, 96, 96, 0.1);
    padding: 0 40px;
}

.main-docs {
    margin-top: 55px;
}

@media (max-width: 1224px) {

    .col-menu-docs,
    .col-tablecontent-docs {
        display: none !important;
    }
}

.dev-iframe._53 {
    position: absolute;
    inset: 0;
}

.dev-iframe {
    background-color: #1c1e36;
    display: flex;
    justify-content: center;
}

.preview-device.device-iphoneX.orientation-landscape {
    transform: translate(-50%);
    transform-origin: 0 0;
    height: 361.2096756884px;
    width: 734.2057395143px;
}

.preview-device.device-iphoneX.orientation-landscape .device-body {
    width: 361.2096756884px;
    height: 734.2057395143px;
    transform: translate(-50%) translateY(-50%) rotate(-90deg);
}

._54._55 {
    position: absolute;
    inset: 0;
}

._54 {
    background-color: #1c1e36;
    display: flex;
    justify-content: center;
}

.modal-preview {
    background-color: #f1f1f5 !important;
    min-height: calc(100vh - 56px);
}

.preview-type {
    display: flex;
    justify-content: center;
    padding: 16px 0;
}

.box_preview_type {
    display: inline-grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(2em, 1fr);
    background-color: #f1f1f5;
    border-radius: 8px;
    padding: 4px;
    height: 36px;
    align-items: center;
    width: 100px;
    background: #e9e9f5;
}

.box_preview_type ._5i {
    padding: 0px 8px;
}

._5i:not(:disabled) {
    color: #8c8fa6;
    text-align: center;
    cursor: pointer;
    border-radius: 0;
    background: none;
    box-shadow: none;
    margin-bottom: 0;
    fill: #8c8fa6;
}

._5i:not(:disabled).active,
._5i:not(:disabled):focus {
    color: #1c1e36;
    border-radius: 4px;
    background: #fff;
    fill: #595b77;
}

._41 {
    height: 20px;
    width: 20px;
    display: inline-block;
    vertical-align: middle;
    -webkit-user-select: none;
    user-select: none;
    margin-top: -2px;
}

.preview-landscape {
    height: calc(100vh - 160px);
    display: flex;
    align-items: center;
}

.btn_custom {
    border-color: #f15a28 !important;
    background-color: #f15a28 !important;
}

.intro_item {
    margin: 10px 0;
}

.intro_item p {
    font-size: 18px !important;
    font-weight: bold !important;
}

.bg--theme,
.shape--blue-400:after {
    background-color: #f15a28;
}

@media (max-width: 767px) {
    #hero-2 {
        text-align: center;
        padding-top: 30px;
        padding-bottom: 50px;
    }

    .hero-first {
        margin-bottom: 20px;
    }
}

.w-28 {
    width: 7rem !important;
}

@media (max-width: 447px) {
    .list-icon-network .px-4 {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    #compare .h-9 {
        height: 25px !important;
    }

    .header-row-text {
        font-size: 13px !important;
        line-height: 16px !important;
    }
}

@media (max-width: 424px) {
    .list-icon-network .px-4 {
        padding-right: 8px !important;
        padding-left: 8px !important;
    }
}

@media (max-width: 394px) {
    .list-icon-network .px-4 {
        padding-right: 6px !important;
        padding-left: 6px !important;
    }
}

@media (max-width: 375px) {
    .list-icon-network .w-24 {
        width: 5rem !important;
    }
}

.grecaptcha-badge {
    display: none !important;
}