#student-bottom-nav.s-dock-bar.is-8,

.s-dock-bar.is-8 {

    width: fit-content !important;

    max-width: calc(100vw - 1rem);

    justify-content: center !important;

    align-items: center !important;

    gap: 0.06rem;

    padding: 0.24rem 0.3rem;

    box-sizing: border-box;

    overflow: hidden;

}

#student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn,

.s-dock-bar.is-8 > .s-dock-btn {

    flex: 0 0 auto !important;

    flex-shrink: 0 !important;

    width: 2.35rem;

    max-width: 2.35rem;

    min-width: 2.35rem;

    aspect-ratio: 1 / 1;

    padding: 0;

    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

}

#student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn i,

.s-dock-bar.is-8 > .s-dock-btn i {

    line-height: 1;

    pointer-events: none;

}

#student-bottom-nav.s-dock-bar.is-8 > .s-dock-comms-menu,

.s-dock-bar.is-8 > .s-dock-comms-menu {

    position: absolute;

    pointer-events: none;

}



@media (max-width: 767px) {

    #student-panel #student-bottom-nav.s-dock-bar.is-8,

    #student-bottom-nav.s-dock-bar.is-8,

    .s-dock-bar.is-8 {

        width: fit-content !important;

        max-width: calc(100vw - 1.2rem) !important;

        justify-content: center !important;

        gap: 0.03rem !important;

        padding: 0.2rem 0.22rem !important;

    }

    #student-panel #student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn,

    #student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn,

    .s-dock-bar.is-8 > .s-dock-btn {

        width: 2.08rem !important;

        max-width: 2.08rem !important;

        min-width: 2.08rem !important;

        height: 2.08rem !important;

        flex: 0 0 2.08rem !important;

        font-size: 1.05rem !important;

    }

    #student-panel #student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn > i,

    #student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn > i,

    .s-dock-bar.is-8 > .s-dock-btn > i {

        font-size: 1.05rem !important;

    }

    #student-panel #student-bottom-nav.s-dock-bar.is-8 .s-dock-quest-stack {

        width: 1.22em !important;

        height: 1.22em !important;

    }

    #student-panel #student-bottom-nav.s-dock-bar.is-8 .s-dock-comms-duo {

        font-size: 1.12rem !important;

    }

}



@media (max-width: 390px) {

    #student-panel #student-bottom-nav.s-dock-bar.is-8,

    #student-bottom-nav.s-dock-bar.is-8,

    .s-dock-bar.is-8 {

        max-width: calc(100vw - 1rem) !important;

        padding: 0.18rem 0.2rem !important;

        gap: 0.02rem !important;

    }

    #student-panel #student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn,

    #student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn,

    .s-dock-bar.is-8 > .s-dock-btn {

        width: 1.98rem !important;

        max-width: 1.98rem !important;

        min-width: 1.98rem !important;

        height: 1.98rem !important;

        flex: 0 0 1.98rem !important;

        font-size: 1rem !important;

    }

    #student-panel #student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn > i,

    #student-bottom-nav.s-dock-bar.is-8 > .s-dock-btn > i,

    .s-dock-bar.is-8 > .s-dock-btn > i {

        font-size: 1rem !important;

    }

    #student-panel #student-bottom-nav.s-dock-bar.is-8 .s-dock-quest-stack {

        width: 1.16em !important;

        height: 1.16em !important;

    }

    #student-panel #student-bottom-nav.s-dock-bar.is-8 .s-dock-comms-duo {

        font-size: 1.08rem !important;

    }

}



#nav-s-sutlac.s-dock-btn,

#nav-s-sutlac.s-dock-btn i {

    color: #f59e0b;

}

#student-panel[data-student-theme] #nav-s-sutlac.s-dock-btn,

#student-panel[data-student-theme] #nav-s-sutlac.s-dock-btn i {

    color: #fbbf24;

}



/* Dock simge renk paleti + özel ikonlar */

#student-bottom-nav #nav-s-home-tab > i {

    color: #22c55e !important;

    filter: drop-shadow(0 1px 2px rgba(34, 197, 94, 0.35));

}

#student-bottom-nav #nav-s-library-tab > i {

    color: #f97316 !important;

    filter: drop-shadow(0 1px 2px rgba(249, 115, 22, 0.32));

}

#student-bottom-nav #nav-s-homework-tab > i {

    color: #ca8a04 !important;

    filter: drop-shadow(0 1px 2px rgba(202, 138, 4, 0.32));

}

#student-bottom-nav #nav-s-exams-tab > i {

    color: #34d399 !important;

    -webkit-text-fill-color: #34d399 !important;

    filter: drop-shadow(0 1px 2px rgba(52, 211, 153, 0.35));

}

#student-bottom-nav #nav-s-shop-tab > i {

    color: #38bdf8 !important;

    filter: drop-shadow(0 1px 3px rgba(56, 189, 248, 0.45));

}

#student-bottom-nav #nav-s-sutlac > i {

    color: #f59e0b !important;

    -webkit-text-fill-color: #f59e0b !important;

    filter: drop-shadow(0 1px 2px rgba(245, 158, 11, 0.35));

}



#student-bottom-nav #nav-s-quest-tab {

    align-items: center !important;

    justify-content: center !important;

}



/* Görevler: çizim referanslı checklist SVG — 2 tik + 1 çarpı */

.s-dock-quest-stack {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 1.14em;

    height: 1.14em;

    flex: 0 0 auto;

    line-height: 0;

    transform: translateY(-0.01em);

}

.s-dock-quest-svg {

    display: block;

    width: 100%;

    height: 100%;

    overflow: visible;

}



/* İletişim: karşılıklı iki balon — krem + yeşil */

.s-dock-comms-duo {

    position: relative;

    display: inline-block;

    width: 1.18em;

    height: 0.92em;

    font-size: inherit;

    line-height: 1;

}

.s-dock-comms-duo i {

    position: absolute;

    font-style: normal;

    line-height: 1;

}

#student-bottom-nav #nav-s-comms .s-dock-comms-duo .is-left {

    left: 0;

    bottom: 0;

    font-size: 0.76em;

    color: #e8dcc4 !important;

    -webkit-text-fill-color: #e8dcc4 !important;

    transform: scaleX(-1);

    filter: drop-shadow(0 0 0.5px rgba(15, 23, 42, 0.45)) drop-shadow(0 1px 1px rgba(15, 23, 42, 0.18));

}

#student-bottom-nav #nav-s-comms .s-dock-comms-duo .is-right {

    right: 0;

    top: 0;

    font-size: 0.76em;

    color: #22c55e !important;

    -webkit-text-fill-color: #22c55e !important;

    filter: drop-shadow(0 1px 2px rgba(34, 197, 94, 0.35));

}



#student-panel.hidden {

    display: none !important;

}

#student-panel.hidden #student-bottom-nav,

#student-panel.hidden #sutlac-root,

#teacher-panel:not(.hidden) ~ #student-panel #student-bottom-nav,

#teacher-panel:not(.hidden) ~ #student-panel #sutlac-root,

#teacher-dashboard-view #student-bottom-nav,

#teacher-root #student-bottom-nav,

#teacher-panel #student-bottom-nav,

#teacher-panel #sutlac-root,

body.is-teacher #student-bottom-nav,

body.is-teacher #sutlac-root,

body:has(#teacher-panel:not(.hidden)) #student-bottom-nav,

body:has(#teacher-panel:not(.hidden)) #sutlac-root {

    display: none !important;

    visibility: hidden !important;

    pointer-events: none !important;

}