/* ══════════════════════════════════════════════
   App Shell — body, blobs, layout containers
   ══════════════════════════════════════════════ */

/* ── Body ── */
body {
    background: var(--t-body);
    color: var(--t-text);
    overflow-x: hidden;
    font-family: 'Inter', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::selection {
    background: rgba(239, 68, 68, 0.3);
    color: var(--t-text-strong);
}

/* ── App Container ── */
#app {
    position: relative;
    z-index: 10;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

/* ── Background Blobs ── */
.bg-blobs {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.bg-blob {
    position: absolute;
    border-radius: 50%;
    mix-blend-mode: screen;
}

.bg-blob--red {
    top: -10%;
    left: -10%;
    width: 300px;
    height: 300px;
    background: var(--t-blob-red);
    filter: blur(120px);
}

.bg-blob--orange {
    bottom: -10%;
    right: -10%;
    width: 250px;
    height: 250px;
    background: var(--t-blob-orange);
    filter: blur(100px);
}

@media (min-width: 640px) {
    .bg-blob--red {
        width: 600px;
        height: 600px;
    }

    .bg-blob--orange {
        width: 500px;
        height: 500px;
    }
}

.bg-noise {
    position: absolute;
    inset: 0;
    background: url('../../assets/images/noise.svg');
    opacity: var(--t-noise);
    mix-blend-mode: overlay;
    display: none;
}

@media (min-width: 640px) {
    .bg-noise {
        display: block;
    }
}

/* ── Layout Containers ── */
.container-main {
    max-width: 80rem;
    /* 1280px / 7xl */
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}

@media (min-width: 768px) {
    .container-main {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

.content-wrapper {
    padding-top: 2rem;
    padding-bottom: 3rem;
}

@media (min-width: 768px) {
    .content-wrapper {
        padding-top: 3rem;
        padding-bottom: 4rem;
    }
}

/* ── Main ── */
main {
    flex-grow: 1;
}

/* ── Utility: hidden ── */
.hidden {
    display: none !important;
}

/* ── Utility: scrollbar-none ── */
.scrollbar-none {
    scrollbar-width: none;
}

.scrollbar-none::-webkit-scrollbar {
    display: none;
}

/* ── Performance: content-visibility ── */
/* Off-screen sekce — přeskočit rendering dokud nejsou viditelné */
.admin-sidebar {
    content-visibility: auto;
    contain-intrinsic-size: 300px 100vh;
}

.dialog-fullscreen {
    content-visibility: auto;
    contain-intrinsic-size: 100vw 100vh;
}