@import "tailwindcss";
@custom-variant dark (&:where(.dark, .dark *));

@plugin "daisyui" {
    themes: all;
}

/**
    --color-base-100 - DaisyUI background
 */

html, body, #app {
    overflow-x: hidden;
}

:root {
    --swiper-pagination-bullet-horizontal-gap: 1px;
    --swiper-pagination-bullet-size: 6px;
    --swiper-pagination-color: #777;
    --swiper-pagination-bottom: 0px;
    --product_list_title_max_lines: 2;
    --tc-navbar-min-height: 3rem;
}

#app {
    position: relative;
    /*padding-top: var(--tg-content-safe-area-inset-top);*/
    padding-bottom: var(--tg-content-safe-area-inset-bottom);
    padding-left: var(--tg-content-safe-area-inset-left);
    padding-right: var(--tg-content-safe-area-inset-right);
}

.app-container {
    /*padding-top: calc(var(--tg-content-safe-area-inset-top) + var(--tg-safe-area-inset-top));*/
    padding-bottom: calc(
            var(--tg-safe-area-inset-bottom, 0px)
                + 72px
    );
    padding-left: var(--tg-safe-area-inset-left, 0px);
    padding-right: var(--tg-safe-area-inset-right, 0px);
}

.safe-top {
    padding-top: calc(var(--tg-content-safe-area-inset-top) + var(--tg-safe-area-inset-top));
}

.app-header {
    z-index: 60;
    position: fixed;
    height: calc(var(--tg-content-safe-area-inset-top, 0px) + var(--tg-safe-area-inset-top, 0px));
    min-height: calc(var(--tg-content-safe-area-inset-top, 0px) + var(--tg-safe-area-inset-top, 0px));
    max-height: calc(var(--tg-content-safe-area-inset-top, 0px) + var(--tg-safe-area-inset-top, 0px));
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: center;
    color: white;
}

.telecart-main-section {
    padding-top: calc(
            var(--tg-content-safe-area-inset-top, 0rem)
            + var(--tg-safe-area-inset-top, 0rem)
            /*+ var(--tc-navbar-min-height)*/
            /*+ 1rem*/
    );
}
