/* folder_nav.css — shared breadcrumb + folder-tile styles for tech pages
 * that present SharePoint folder navigation.
 *
 * Round 2.7 Step 2E (3e-2): extracted from docs.css so the gallery
 * surfaces (Step 2E adds subfolder navigation to the photo gallery) can
 * consume the same styles without duplicating them. docs.css continues
 * to own the file-list and item-row rules; folder_nav.css owns just the
 * navigation chrome.
 *
 * Consumers (load this file FIRST so per-page CSS overrides win on any
 * conflict):
 *   tech/docs.html
 *   tech/gallery.html       (Step 2E adds subfolder nav in photos-mode)
 */

/* Breadcrumbs */
.crumbs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin: 6px 0 10px;
}
.crumb{
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  border-radius:999px;
  padding:8px 10px;
  font-size:13px;
  font-weight:650;
  cursor:pointer;
}
.crumb:active{ transform: translateY(1px); }

/* Folder tiles (single column) */
.folder-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
}

.folder-tile{
  width:100%;
  text-align:left;
  border:1px solid #e6e9ee;
  background:#ffffff;
  border-radius:14px;
  padding:12px;
  cursor:pointer;
  display:flex;
  gap:12px;
  align-items:center;
}
.folder-tile:active{ transform: translateY(1px); }

.folder-ico{
  width: 36px;
  height: 36px;
  border-radius: 12px;
  background: #f3f5f8;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 22px;
  line-height: 1;
}

.folder-title{
  font-weight:750;
  font-size:14px;
  color:#1f2937;
  line-height:1.2;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.folder-sub{
  margin-top:3px;
  font-size:12px;
  color:#5f6b7a;
  line-height:1.2;
}