/**
 * File:          public/css/chat2_rail.css
 * Version:       0.1.0
 * Last Modified: 2026-11-01 08:17 PM EST
 * Changes:       New. Chat 2.0 step 2 rail look (docs/chat2/plan.md R1–R6): round rail toggle (40 px circle, float
 *                surface + soft shadow), version line, compact card rows with a meta line + status dot (avatar and
 *                title keep today's size), floating ⋮ / "…" menus, search type chips, Prompt Builder day headings,
 *                long-press title bubble. Uses the step 1 tokens (chat2_tokens.css). Loaded before chat2_tokens.css.
 */
/* Round toggle, top-left at every width: drawer on phones, hides / shows the whole rail on desktop. */
#rail-toggle.c2-rail-toggle {
  display: inline-grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; padding: 0; margin: 0 8px 0 0;
  border-radius: 50%; border: 1px solid var(--c2-float-line); background: var(--c2-float); color: var(--c2-text);
  box-shadow: var(--c2-float-shadow); cursor: pointer;
}
#rail-toggle.c2-rail-toggle:hover, #rail-toggle.c2-rail-toggle:active { background: var(--c2-surface-3); }
#rail-toggle.c2-rail-toggle svg { pointer-events: none; }
/* Desktop: the round toggle is the one control; the drawer's own close button is for phones. */
@media (min-width: 769px) { #sidebar-collapse-btn { display: none !important; } }
@media (max-width: 768px) {
  #sidebar-collapse-btn { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--c2-float-line);
    background: var(--c2-float); box-shadow: var(--c2-float-shadow); }
}
#sidebar-version { font-size: 11px; line-height: 1.3; color: var(--c2-dim); margin-top: 1px; }
#sidebar-version:empty { display: none; }

/* Rows: compact cards. Avatar 28 px and title 13 px as before; one meta line under the title. */
.mw-rail .mw-rail-row, .mw-search-results .mw-rail-row { border-radius: 12px; margin: 1px 0; }
.mw-rail .mw-rail-row:hover, .mw-search-results .mw-rail-row:hover { background: var(--c2-surface-2); }
.mw-rail-row .mw-rail-item { padding: 7px 8px; gap: 10px; border-radius: 12px; }
.mw-rail-row .mw-rail-item:hover { background: transparent; }
.mw-rail-row.mw-current { border-radius: 12px; }
.mw-rail-item .mw-rail-meta { display: flex; align-items: center; gap: 0; flex: none; min-width: 0; margin-top: 1px;
  font-size: 11px; line-height: 1.35; color: var(--c2-muted); white-space: nowrap; overflow: hidden; }
.mw-rail-meta .c2-dot { margin-right: 6px; }
.mw-rail-meta > span:not(.c2-dot) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mw-rail-meta .mw-rail-handle { flex: 0 0 auto; max-width: 55%; color: var(--c2-muted); }
.mw-rail-meta .mw-rail-sep { flex: none; padding: 0 5px; }
.mw-rail-meta .mw-rail-model { flex: 1 1 0; }
.mw-rail-meta-text { flex: 1 1 auto; }

/* Row ⋮ and section "…" menus float above the page (rail_menu.js places them on screen). */
.mw-rail-menu { z-index: 10060; min-width: 190px; padding: 6px; border: 1px solid var(--c2-line-2); border-radius: 16px;
  background: var(--c2-surface); box-shadow: 0 18px 50px rgba(0, 0, 0, .6); }
.mw-rail-menu .mw-rail-menu-item { min-height: 44px; padding: 0 14px; border: 0; border-radius: 10px; font-size: 14.5px; color: var(--c2-text); }
.mw-rail-menu .mw-rail-menu-item + .mw-rail-menu-item { border-top: 0; }
.mw-rail-menu .mw-rail-menu-item:hover, .mw-rail-menu .mw-rail-menu-item:focus-visible { background: var(--c2-surface-2); }
.mw-rail-menu .mw-rail-menu-danger { color: var(--c2-failed); }
.mw-rail-menu [aria-checked="true"]::after { content: "✓"; float: right; margin-left: 16px; color: var(--c2-accent); }
.mw-sort-toggle { letter-spacing: 1px; }

/* Search: the browser's clear (×) button is blue by default; no blue. */
.mw-search input[type="search"]::-webkit-search-cancel-button { filter: grayscale(1) brightness(1.8); cursor: pointer; }
/* Search type chips (shown only once search is open). */
.c2-search-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 6px; }
.c2-search-chip { min-height: 32px; padding: 0 12px; border-radius: 16px; border: 1px solid var(--c2-line-2); background: transparent;
  color: var(--c2-text-2); font: 500 12.5px var(--c2-font); cursor: pointer; white-space: nowrap; }
.c2-search-chip:hover { background: var(--c2-surface-2); }
.c2-search-chip[aria-pressed="true"] { background: var(--c2-accent); border-color: transparent; color: var(--c2-accent-ink); }

/* Prompt Builder day headings (sorted by Recently updated). */
.mw-day-title { display: block; width: 100%; text-align: left; border: 0; background: none; cursor: pointer;
  padding: 8px 2px 6px 12px; font: 500 11.5px var(--c2-font); color: var(--c2-dim); }
.mw-day-title:hover { color: var(--c2-muted); }

/* Long-press full title. */
.c2-rail-tip { position: fixed; z-index: 10070; max-width: min(320px, calc(100vw - 16px)); padding: 8px 12px; border-radius: 12px;
  background: var(--c2-surface-3); color: var(--c2-text); font-size: 13px; line-height: 1.4; box-shadow: var(--c2-float-shadow);
  overflow-wrap: anywhere; pointer-events: none; }
/* === END OF FILE (FILENAME: public/css/chat2_rail.css) === */