/* #theme-toggle {
    display: none;
} */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

.font-sans {
    font-family: Inter, sans-serif !important;
}

html, :host {
    font-family: Inter, sans-serif !important;
}

.jetstream-modal img[alt="QR Code Preview"] {
    height: 100%;
    width: 100%;
}

.border {
    border-width: 2px;
}

.dark [data-tooltip-target] img {
    filter: brightness(0) invert(1); /* Example: Turn image to white */
}

@media (max-width: 600px) {
    .w-48 {
        width: 11rem;
}
    .h-screen {
        width: 100%;
    }
    
    .grid-cols-5 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
}
    .text-lg {
        font-size: 1rem;
    }
    
    .crisp-client .cc-1brb6[data-full-view=true] .cc-1yy0g .cc-1m2mf {
        margin-right: 10px !important;
    }
    .bottom-6 {
        bottom: 5.5rem;
    }
    
    .text-4xl {
    font-size: 1.6rem;
    line-height: 1.6rem;
    }

}

.px-2 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.object-cover {
    object-fit: contain;
    background-color: #f4f4f4;
}

#changeBranchButton {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
}

#changeBranchButton svg {
    vertical-align: middle;
    display: inline-flex;
}

.text-sm {
    font-size: 14px;
    line-height: 1.25rem;
}

.text-xs {
    font-size: 13px;
    line-height: 1rem;
}

[type=text], [type=email], [type=url], [type=password], [type=number], [type=date], [type=datetime-local], [type=month], [type=search], [type=tel], [type=time], [type=week], [multiple], textarea, select {
    font-size: 13px;
}

.text-gray-500 {
    --tw-text-opacity: 1;
    color: #3d4451;
}

.text-gray-400 {
    --tw-text-opacity: 1;
    color: #81858c;
}

.border-gray-100 {
    border-color: rgb(227 228 229);
}

.dark .text-gray-500{
    color: #a7a9ad;
}

.dark .text-gray-500:hover{
    color: #a7a9ad;
}

#settingsTabsList.border-gray-300 {
    --tw-border-opacity: 1;
    border-radius: 0;
    margin-left: 4px;
}

#settingsTabsList.border-gray-300:hover {
    --tw-border-opacity: 1;
    border: 0;
    background-color: #dbfffc;
    border-radius: 0;
    margin-left: 4px;
}

#settingsTabsList.border-gray-300:active {
    --tw-border-opacity: 1;
    border: 0;
    background-color: #dbfffc;
    border-radius: 0;
    margin-left: 4px;
}

.bg-skin-base .text-gray-400 {
    color: white;
}