@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    --primary-color: #52B137;
    --primary: 107 53% 45%;
    --secondary-color: #EEC70B;
    --text-color: #5D5B5F;
    --text-dark: #28232d;
}

body,
* {
    font-family: "Inter", sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 500 !important;
    font-family: "Inter", sans-serif
}

.theme-light h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--text-dark) !important;
}

p {
    font-family: "Inter", sans-serif
}

.theme-light p {
    color: var(--text-color) !important;
}

.theme-light .lqd-page-content-wrap {
    background: #f3f5f7;
}

.lqd-card {
    box-shadow: 0 .1rem 0.5rem 0 rgba(40, 35, 45, .02);
    border-radius: 14px;
    background: #fff !important;
}

.btn {
    padding: 11px 22px;
    border-radius: 8px;
    font-size: 14px;
    text-decoration: none !important;
}

.text-light {
    color: var(--text-color);
}

.text-dark {
    color: var(--text-dark);
}

.btn-primary,
.btn-primary:hover {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

.btn-secondary {
    background: var(--secondary-color);
    color: var(--text-dark);
    border-color: var(--secondary-color);
}

.search-input .btn {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 0px 10px 10px 0px;
    width: 130px;
}

.search-input {
    width: 70%;
    margin: auto;
    position: relative;
}

.search-input span.absolute.end-12.top-1\/2.-translate-y-1\/2 {
    right: 140px;
}

.search-input input.lqd-input {
    height: 55px;
    border-radius: 10px;
}

.btncreate {
    border: 1px solid #fff;
    padding-left: 20px;
    font-size: 13px;
    color: var(--text-dark);
    position: absolute;
    top: 12px;
    left: 13px;
    text-decoration: none !important;
}

.group:hover .group-hover\:bg-heading-foreground {
    background-color: var(--primary-color);
}

.rounded-\[calc\(var\(--input-rounded\)\*var\(--input-rounded-multiplier\)\+0\.25rem\)\] {
    border-radius: 10px;
}

.w-\[--navbar-width\] {
    width: 15rem;
}

.start-\[--navbar-width\] {
    inset-inline-start: 15rem;
}

.lqd-navbar-link {
    padding: 12px 16px;
}

.lqd-navbar-label {
    width: 100%;
    text-align: center;
    position: relative;
    padding: 5px;
}

.lqd-navbar-label:before {
    content: '';
    width: 35%;
    left: 0px;
    height: 0;
    position: absolute;
    border-top: 1px dashed #ccc;
    top: 50%;
    translate: 0 -50%;
}

span.lqd-navbar-label:after {
    content: '';
    width: 35%;
    right: 0px;
    height: 0;
    position: absolute;
    border-top: 1px dashed #ccc;
    top: 50%;
    translate: 0 -50%;
}

.lqd-navbar-inner {
    padding-right: 37px;
    overflow-x: hidden;
}

@media (min-width: 1320px) {
    .container {
        max-width: 1370px;
    }
}

.header-actions-container .flex.items-center.gap-4.max-lg\:gap-2 .lqd-btn.rounded-button.lqd-btn-link {
    box-shadow: none !important;
    height: 40px;
    width: 40px;
    border-radius: 40px;
}

.theme-light .header-actions-container .flex.items-center.gap-4.max-lg\:gap-2 .lqd-btn.rounded-button.lqd-btn-link {
    background: #e9e9ea;
}

.theme-dark .header-actions-container .flex.items-center.gap-4.max-lg\:gap-2 .lqd-btn.rounded-button.lqd-btn-link {
    background: #24272c;
}

.lqd-nav-link-icon svg {
    color: var(--primary-color);
}

.hover\:text-navbar-foreground-hover:hover {
    color: var(--primary-color);
}

.lqd-navbar-link {
    padding: 12px 16px;
}

.theme-light .lqd-navbar-link {
    color: var(--text-dark);
}

.\[\&\.active\]\:text-navbar-foreground-active.active,
.\[\&\.active\]\:text-navbar-foreground-active.active svg {
    color: #fff;
}

.\[\&\.active\]\:bg-navbar-background-active\/5.active {
    background: var(--primary-color);
}

.lqd-header-container input.lqd-input.block.peer {
    border-radius: 8px;
}

a.lqd-btn.adminpanel {
    box-shadow: none;
    padding: 11px 20px;
}

.theme-light a.lqd-btn.adminpanel,
.theme-light a.lqd-btn.adminpanel:hover {
    background: #e9e9ea;
    color: var(--text-dark);
}

.linkcard .lqd-card-body {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 20px 16px;
}

.linkcard {
    border: 1px solid #fff;
    transition: .2s all ease-in-out;
    overflow: hidden;
    position: relative;
}

.linkcard .icon {
    height: 45px;
    width: 45px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border: 1px solid;
    transition: 1s;
    translate: 0 -2px;
    position: relative;
    font-size: 18px;
}

.linkcard:hover {
    border: 1px solid var(--primary-color);
}

.linkcard2:hover {
    border: 1px solid var(--secondary-color);
}

.linkcard3:hover {
    border: 1px solid #7366FF;
}

.linkcard p {
    font-size: 14px;
}

.linkcard .icon {
    box-shadow: 0px 10.511241px 12.4089927673px 0px #dcf1da;
    color: var(--primary-color);
}

.linkcard:hover .icon {
    box-shadow: none;
    translate: 0 1px;
}

.linkcard .icon2 {
    box-shadow: 0px 10.511241px 12.4089927673px 0px #fff7e5;
    color: var(--secondary-color);
}

.linkcard .icon3 {
    box-shadow: 0px 10.511241px 12.4089927673px 0px #e8e5ff;
    color: #7366FF;
}

.linkcard:after {
    content: '\f061';
    font-family: 'Font Awesome 5 Pro';
}

.linkcard:after {
    content: '\f061';
    font-family: 'Font Awesome 5 Pro';
    position: absolute;
    top: 18px;
    left: 0px;
    background: var(--primary-color);
    height: 0px;
    width: 0px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 12px;
    rotate: -45deg;
    transition: 1s;
    opacity: 0;
}

.linkcard:hover:after {
    height: 24px;
    width: 24px;
    left: 90%;
    opacity: 1;
}

.statscard {
    background: #f1f1f1;
    padding: 10px 20px;
    align-items: center;
    border-radius: 10px;
}

.statscard svg {
    height: 40px;
    width: 40px;
    margin-right: 10px;
}

.bg-accent {
    background-color: var(--primary-color);
}

.statscard i {
    font-size: 30px;
    color: var(--primary-color);
    margin-right: 12px;
}

.planecard {
    background-image: url(/images/bg-3.png);
    background-size: cover;
}

.planecard .lqd-card-body {
    padding: 20px;
}

.lqd-posts-item.lqd-docs-item.lqd-docs-item-extended {
    box-shadow: none;
    border: 1px solid #d1d1d1;
}

p.lqd-titlebar-pretitle.text-xs.text-foreground\/70.m-0 {
    display: none;
}

.lqd-page-content-container>.py-10 {
    padding-top: 0px !important;
}

h1.lqd-titlebar-title.m-0 {
    font-size: 24px;
    font-weight: 600 !important;
}

.lqd-titlebar-col .lqd-btn {
    padding: 10px 22px;
    border-radius: 8px;
    font-size: 14px;
    box-shadow: none;
}

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

.lqd-titlebar-col .lqd-btn.bg-background.text-foreground.shadow-xs.hover\:bg-primary.hover\:text-primary-foreground.dark\:hover\:bg-foreground.dark\:hover\:text-background.focus-visible\:bg-primary {
    background: var(--secondary-color);
    color: var(--text-dark) !important;
}

.size-7 {
    width: 2.05rem;
    height: 2.05rem;
}

.\[\&\.active\]\:bg-foreground\/5.active {
    background-color: hsl(var(--foreground) / .10);
}

.foldermenu {
    position: absolute;
    right: -10px;
}

.folder-card .lqd-card {
    position: relative;
    background: #fff;
}

.table-card {
    box-shadow: 0 .1rem 0.5rem 0 rgba(40, 35, 45, .02);
    border-radius: 14px;
    background: #fff;
}

.table-card th,
.table-card .lqd-posts-head {
    color: #52526c;
    font-size: 13px;
    font-weight: 600;
    border-bottom: 1px solid #ececec;
}

.table-card td,
.table-card .lqd-posts-item {
    border: 0px !important;
    border-top: 1px dashed #d8d8d8 !important;
    color: var(--text-color);
}

.table-card[data-view-mode="grid"] .lqd-posts-item {
    border: 1px solid #d1d1d1 !important;
}

.table-card[data-view-mode="grid"] .tableicon {
    background: transparent;
}

.lqd-posts-item-title {
    margin: 0px;
    font-size: 14px;
}

.hover\:bg-foreground\/5:hover {
    background-color: hsl(var(--foreground) / .04);
}

.table-card .size-5 {
    width: 1.25rem;
    height: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.far,
.fal,
.fa,
.fas {
    font-family: 'Font Awesome 5 Pro' !important;
}

.tableicon {
    background: #e9e9ea;
    border-radius: 8px;
    box-shadow: none;
}

/* START TOOLTIP STYLES */
[tooltip] {
    position: relative;
}

[tooltip]::before,
[tooltip]::after {
    text-transform: none;
    font-size: .9em;
    line-height: 1;
    user-select: none;
    pointer-events: none;
    position: absolute;
    display: none;
    opacity: 0;
}

[tooltip]::before {
    content: '';
    border: 5px solid transparent;
    z-index: 1001;
}

[tooltip]::after {
    content: attr(tooltip);
    text-align: center;
    min-width: 3em;
    max-width: 21em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 1ch 1.5ch;
    border-radius: .3ch;
    box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
    background: #333;
    color: #fff;
    z-index: 1000;
    border-radius: 6px;
}

/* Make the tooltips respond to hover */
[tooltip]:hover::before,
[tooltip]:hover::after {
    display: block;
    opacity: 1;
    bottom: calc(100% + 10px);
}

[tooltip]:hover::before {
    bottom: calc(100% + 6px);
    border: 5px solid #333333;
    rotate: 45deg;
}

.tableicon .hover\:bg-background:hover {
    background-color: transparent;
    box-shadow: none !important;
}

.sorttabs form.lqd-filter-list {
    gap: 5px;
}

.sorttabs .lqd-btn {
    padding: 7px 12px;
    border-radius: 6px;
    min-width: 70px;
    background-color: #ececec;
    box-shadow: none !important;
}

.\[\&\.active\]\:bg-foreground\/5.active {
    background-color: var(--secondary-color) !important;
    color: var(--text-dark);
}

.table-card[data-view-mode="grid"] {
    padding: 20px;
}

.lqd-docs-list.grid.grid-cols-1.gap-4.md\:grid-cols-2.lg\:grid-cols-5 .tableicon {
    background: transparent;
}

.lqd-generator-sidebar-step-container .lqd-generator-filter-trigger {
    padding: 20px;
    background: #f5f5f5;
    margin-bottom: 10px;
    border-radius: 10px;
}

.lqd-generator-categories .lqd-generator-item {
    background: #eec70b57;
    border-radius: 10px;
}

.tox .tox-edit-area {
    background: linear-gradient(45deg, #f5f6fe, #faf5fb);
    padding: 12px;
}


.aiwritertabs .lqd-filter-btn {
    /* flex-wrap: nowrap; */
    padding: 10px 20px !important;
    border-radius: 8px;
    background: #ececec;
    box-shadow: none !important;
}

#lqd-generators-list .lqd-card {
    padding: 30px !important;
}

footer.lqd-page-footer {
    background: #fff;
    padding: 10px;
    margin-top: 40px;
}

footer .order-2.grow.basis-full.md\:order-first.md\:basis-0.lg\:ms-auto {
    display: none;
}

footer p {
    margin: 0px;
    font-size: 13px;
    font-weight: 500;
}

button#openai_generator_button {
    border-radius: 8px;
}

.border-input-border,
.form-control {
    border-color: hsl(200deg 6.1% 88.98%);
    border-radius: 8px;
}

.rounded-button {
    border-radius: 8px;
}

.\[\&\.active\]\:bg-foreground\/10.active {
    background-color: var(--secondary-color);
}

.lqd-filter-list button.lqd-btn {
    padding: 9px 30px;
    background: #ececec;
}

.lqd-filter-list button.lqd-btn.active {
    background-color: var(--secondary-color);
}

.lqd-image-generator-tabs-nav button.lqd-btn {
    background: #ececec;
    font-weight: 500;
}

.lqd-image-generator-tabs-nav button.lqd-btn.active {
    background: var(--secondary-color);
}

.lqd-legend span.ms-auto.font-medium {
    background: #ffe45d;
    padding: 3px 6px;
    font-size: 12px;
    border-radius: 4px;
}

.btn-light {
    background: #f5f5f5;
    border-color: #f5f5f5;
    color: var(--text-dark);
}

.aiimagetabs {
    background-color: #f5f5f5;
    border-radius: 8px;
}

.aiimagetabs .lqd-tabs-trigger {
    background: transparent;
    color: var(--text-dark);
}

.aiimagetabs .lqd-tabs-trigger.active {
    background: var(--primary-color);
    color: #fff;
}

a.lqd-btn.group.inline-flex.items-center.justify-center.gap-1\.5.text-xs.font-medium.rounded-button.transition-all.hover\:-translate-y-0\.5.hover\:shadow-xl.hover\:shadow-black\/5.disabled\:bg-foreground\/10.disabled\:text-foreground\/35.disabled\:pointer-events-none.lqd-btn-outline.outline.-outline-offset-1.focus-visible\:outline-2.focus-visible\:outline-offset-0.focus-visible\:outline-secondary.lqd-btn-md.lqd-btn-hover-none.absolute.end-0.top-0.size-9.shrink-0.p-0.outline-heading-foreground\/10.hover\:bg-primary.hover\:text-primary-foreground {
    padding: 0px;
}

button.keyword {
    padding: 5px 12px;
    border-radius: 5px;
    background: #ececec;
    border: 0px;
}

button.keyword.cursor-pointer.bg-secondary {
    background: var(--secondary-color);
}

.bg-secondary {
    background-color: var(--secondary-color);
}

.lqd-realtime-image-nav a img {
    height: 30px;
}

.tox.tox-tinymce {
    border: 1px solid #ececec !important;
}

.tox:not(.tox-tinymce-inline) .tox-editor-header:not(.tox-editor-dock-transition) {
    padding: 5px;
}

.checked\:bg-heading-foreground:checked {
    background-color: var(--primary-color) !important;
}

.checked\:border-heading-foreground:checked {
    border-color: var(--primary-color) !important;
}



[data-generator-type="audio"] .lqd-card.text-card-foreground.bg-card-background.w-full.transition-all.group\/card.lqd-card-outline.border-card-border.rounded-card.lqd-generator-options-card.relative.border-2.border-dashed {
    border-color: var(--fc-button-bg-color);
}

.header-user-dropdown .lqd-dropdown-dropdown {
    width: 300px;
}

div#code-output {
    max-width: 100%;
}

.form-group .form-control {
    min-height: 46px;
    ;
}

.navbar-brand.loginbar img {
    height: 40px;
    margin-bottom: 20px;
}

.lqd-filepicker-label.border-dashed {
    border-color: var(--primary-color);
}