/* assets/css/home-shell.css — Slice 0 homepage pivot */

/* ══════════════════════════════════════════════
   MOBILE TAB BAR
   ══════════════════════════════════════════════ */
.home-tab-bar-mobile .home-tab-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    flex: 1;
    height: 100%;
    color: #6b7280;
    font-size: 20px;
    background: transparent;
    border: 0;
    cursor: pointer;
    transition: color .15s ease;
    -webkit-tap-highlight-color: transparent;
}
.dark .home-tab-bar-mobile .home-tab-btn { color: #a1a1aa; }

.home-tab-bar-mobile .home-tab-btn:hover,
.home-tab-bar-mobile .home-tab-btn.active { color: var(--primary, #024bd6); }

.home-tab-label {
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

/* Center + button */
.home-tab-center { flex: 0 0 auto; width: 64px; }
.home-tab-center .home-tab-plus {
    width: 48px; height: 48px;
    border-radius: 9999px;
    background: var(--primary, #024bd6);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    box-shadow: 0 6px 20px -4px rgba(2, 75, 214, .55);
    border: 3px solid #fff;
    transition: transform .15s ease;
}
.dark .home-tab-center .home-tab-plus { border-color: #000; }
.home-tab-center:active .home-tab-plus { transform: scale(.92); }

/* ══════════════════════════════════════════════
   DESKTOP TAB ROW
   ══════════════════════════════════════════════ */
.home-tab-row .home-tab-rowitem {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 20px;
    font-size: 14px;
    font-weight: 700;
    color: #6b7280;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color .15s ease, border-color .15s ease;
}
.dark .home-tab-row .home-tab-rowitem { color: #a1a1aa; }

.home-tab-row .home-tab-rowitem:hover { color: var(--primary, #024bd6); }
.home-tab-row .home-tab-rowitem.active {
    color: var(--primary, #024bd6);
    border-bottom-color: var(--primary, #024bd6);
}
.home-tab-row .home-tab-rowitem i { font-size: 16px; }

/* ══════════════════════════════════════════════
   TAB PANES
   ══════════════════════════════════════════════ */
.home-pane { display: none; }
.home-pane.active { 
    height:70vh;
    display: block; 
    
}



/* ══════════════════════════════════════════════
   PUSH BODY CONTENT ABOVE MOBILE TAB BAR
   Applied when the shell is on the page (set on <body> by the caller).
   ══════════════════════════════════════════════ */
body.homepage-shell {
    padding-bottom: calc(64px + env(safe-area-inset-bottom));
}
@media (min-width: 768px) {
    body.homepage-shell { padding-bottom: 0; }
}
/* Ensure the middle column reserves space for the world */
#homeShellMain {
    position: relative;
}