/* CleanCodes Menu Styles */
.cc-menu-container { position: fixed; top: 15px; z-index: 99999; }
.cc-menu-container.left { left: 20px; }
.cc-menu-container.right { right: 20px; }

.cc-menu-hamburger {
    background: #fff; border: 2px solid #333; color: #333;
    font-size: 28px; width: 50px; height: 50px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.cc-menu-hamburger:hover { background: #f0f0f0; transform: rotate(90deg); }

.cc-menu-panel {
    position: fixed; top: 75px; background: #fff; border: 1px solid #ddd;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2); width: 320px; max-height: 80vh;
    overflow-y: auto; padding: 20px; border-radius: 8px; display: none;
}
.cc-menu-container.left .cc-menu-panel { left: 20px; }
.cc-menu-container.right .cc-menu-panel { right: 20px; }
.cc-menu-panel.show { display: block; animation: slideDown 0.3s; }
@keyframes slideDown { from {opacity:0; transform:translateY(-10px);} to {opacity:1; transform:translateY(0);} }

.cc-menu-nav-menu { list-style:none; padding:0; margin:0 0 25px 0; }
.cc-menu-nav-menu li { margin-bottom:8px; }
.cc-menu-nav-menu a { text-decoration:none; color:#333; font-weight:500; }

.cc-menu-info-section { border-top:1px solid #eee; padding-top:15px; }
.cc-menu-info-section h4 { margin:0 0 12px 0; color:#555; }

.cc-menu-notes-list { list-style:none; padding:0; }
.cc-menu-note-item { padding:8px 0; border-bottom:1px dotted #ddd; font-size:0.95em; }
.cc-menu-note-desc { color:#666; font-style:italic; }

.note-row { margin-bottom:12px; display:flex; align-items:center; gap:8px; }