/* Reset & base */
* { box-sizing: border-box; margin:0; padding:0; }
html,body { height:100%; font-family: var(--font-family); background:#f9fbfd; color:var(--text); }
#ai-tutor-root { display:flex; flex-direction:row; min-height:70vh; }

/* Sidebar */
.ai-sidebar {
    width:260px; background:var(--sidebar-bg); border-right:1px solid #e2e6ea;
    display:flex; flex-direction:column; transition:transform .3s ease;
}
.ai-sidebar.collapsed { transform: translateX(-260px); }
.ai-sidebar .header {
    padding:1rem; font-weight:600; font-size:1.2rem; background:var(--primary);
    color:#fff; display:flex; align-items:center; justify-content:space-between;
}
.ai-sidebar ul { list-style:none; }
.ai-sidebar li { border-bottom:1px solid #e9ecef; }
.ai-sidebar li button {
    width:100%; text-align:left; padding:.75rem 1rem; background:none;
    border:none; cursor:pointer; font-size:.95rem; color:var(--text);
}
.ai-sidebar li button.active { background:var(--accent); color:#fff; }

/* Hamburger */
.ai-hamburger {
    display:none; background:none; border:none; font-size:1.4rem; cursor:pointer;
    color:#fff;
}

/* Main content area */
.ai-content {
    flex:1; padding:1.5rem; overflow-y:auto; position:relative;
}

/* Toast */
.ai-toast {
    position:fixed; top:50%; left:50%; transform:translate(-50%,-50%);
    background:#fff; border:1px solid #ddd; padding:1.2rem 1.5rem;
    box-shadow:0 4px 12px rgba(0,0,0,.15); border-radius:6px;
    max-width:90%; z-index:9999; display:none;
}
.ai-toast.show { display:block; }
.ai-toast button { margin-top:.8rem; background:var(--primary); color:#fff;
    border:none; padding:.4rem .8rem; border-radius:4px; cursor:pointer; }

/* Responsive */
@media (max-width:768px) {
    #ai-tutor-root { flex-direction:column; }
    .ai-sidebar { position:fixed; height:100%; z-index:1000; }
    .ai-hamburger { display:block; }
    .ai-content { margin-top:60px; }
}