/* DevisVox — Menu — styles.css
   Toutes les règles scopées par #menu-mobile-page
*/

#menu-mobile-page {
  --mn-text:    #0F172A;
  --mn-text2:   #475569;
  --mn-text3:   #94A3B8;
  --mn-danger:  #DC2626;
  --mn-border:  #E2E8F0;
  --mn-bg:      #F9FAFB;
  --mn-r-md:    18px;
  --mn-tr:      .12s ease;

  display: flex; flex-direction: column; height: 100%;
  background: var(--mn-bg); overflow: hidden;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', sans-serif;
  color: var(--mn-text);
}

#menu-mobile-page .mn-hdr   { display: flex; align-items: flex-start; justify-content: space-between; padding: 10px 20px 8px; flex-shrink: 0; margin-bottom: 0; border-bottom: 1px solid var(--mn-border); }
#menu-mobile-page .mn-title { font-size: 21px; font-weight: 800; color: var(--mn-text); letter-spacing: -0.3px; line-height: 1.1; }

#menu-mobile-page .mn-nav   { flex: 1; overflow-y: auto; padding: 4px 16px 16px; display: flex; flex-direction: column; gap: 12px; }
#menu-mobile-page .mn-nav::-webkit-scrollbar { display: none; }

#menu-mobile-page .mn-card  { background: #fff; border-radius: var(--mn-r-md); box-shadow: 0 1px 4px rgba(0,0,0,.07); overflow: hidden; }

#menu-mobile-page .mn-item  {
  display: flex; align-items: center; gap: 14px; width: 100%;
  padding: 15px 18px; border: none; background: transparent;
  font-size: 15.5px; font-weight: 500; color: var(--mn-text);
  cursor: pointer; text-align: left;
  border-bottom: 1px solid var(--mn-border);
  font-family: inherit;
  transition: background var(--mn-tr);
}
#menu-mobile-page .mn-item:last-child { border-bottom: none; }
#menu-mobile-page .mn-item:active     { background: #F8FAFC; }
#menu-mobile-page .mn-item-danger     { color: var(--mn-danger); }


#menu-mobile-page .mn-ico   { width: 20px; height: 20px; flex-shrink: 0; stroke: #64748B; stroke-width: 1.8; fill: none; stroke-linecap: round; stroke-linejoin: round; }
#menu-mobile-page .mn-item-danger .mn-ico { stroke: var(--mn-danger); }

#menu-mobile-page .mn-chev  { margin-left: auto; width: 16px; height: 16px; stroke: #CBD5E1; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
#menu-mobile-page .mn-item-danger .mn-chev { stroke: var(--mn-danger); }