/* File Managr — Light (bundled) */
@import url("./base-lt.css");          /* shared base (titlebar/toolbar/modals/buttons) */
@import url("./clients-lt.css");       /* client cards & grouping */
@import url("./search-lt.css");        /* searchbar visuals */

:root {
  /* Inherit base vars; override/add if needed */
  --asset-panel: rgba(255,255,255,0.6);
  --asset-panel-2: rgba(255,255,255,0.85);
}

/* Toolbar helpers */
.inline-edit { min-width: 160px; border-bottom: 1px solid rgba(255,255,255,0.8); padding: 2px 6px; }
.inline-edit:focus { outline: none; background: transparent; }

/* Assets */
.assets-toolbar { display:flex; align-items:center; justify-content:space-between; margin: 8px 0 0px;}
.assets-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.assets-grid.public { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.assets-empty { text-align:center; padding: 40px; color: var(--muted);}

.asset-card { background: var(--asset-panel); border-radius: 14px; overflow: hidden; display: grid; grid-template-rows: 160px auto; box-shadow: 0 8px 24px rgba(0,0,0,0.06); }
.asset-card .thumb { position:relative; background: linear-gradient(180deg, rgba(0,0,0,.06), rgba(0,0,0,.02)); display:grid; place-items:center; }
.asset-card .thumb img { width: 100%; height: 100%; object-fit: cover; display:block; }
.asset-card .type-icon { width: 40px; height: 40px; opacity: .7; }

.asset-card .meta { padding: 10px 12px; display:grid; gap: 8px; background: rgba(255,255,255,.4); }
.asset-card .name-row { display:flex; align-items:center; gap:8px; }
.asset-card .name { font-weight: 500; font-size: 14px; }
.asset-card .name[contenteditable="true"] { border-bottom: 1px dotted rgba(0,0,0,.2); }
.asset-card .sub { font-size:12px; color: var(--muted); }

/* Tags */
.tags { display:flex; flex-wrap: wrap; gap: 6px; }
.tag-chip { display:inline-flex; align-items:center; gap:6px; padding: 4px 8px; background: rgba(0,0,0,.06); border: 1px solid rgba(0,0,0,.08); border-radius: 999px; font-size: 12px; }
.tag-chip .dot { width:10px; height:10px; border-radius:50%; display:inline-block; }
.tag-chip .rem { margin-left: 2px; opacity:.7; cursor:pointer; }

/* Card actions */
.asset-card .actions { display:flex; align-items:center; justify-content:flex-end; gap: 8px; padding: 8px 10px; border-top: 1px solid rgba(0,0,0,.06); background: rgba(255,255,255,.6); }
.asset-card .actions .icon-btn { min-height: 48px; width: 52px; }
.asset-card .actions .icon-btn .label { color: var(--ink); }

/* Dropzone */
.dropzone { border: 2px dashed rgba(0,0,0,.2); border-radius: 16px; min-height: 160px; display:grid; place-items:center; background: rgba(0,0,0,.02); }
.dropzone:focus { outline: none; box-shadow: 0 0 0 3px rgba(125, 139, 255, .35); }
.dz-cta { text-align:center; color: var(--muted); }

/* Comments */
.comments { display:grid; gap:10px; max-height: 220px; overflow:auto; padding: 6px; background: rgba(0,0,0,.02); border-radius: 10px; }
.comment { display:grid; gap:4px; padding:8px 10px; background: rgba(0,0,0,.03); border-radius: 10px; }
.comment .by { font-size: 12px; color: var(--muted); }

/* Public banner */
.public-banner { display:flex; align-items:baseline; justify-content:space-between; padding: 8px 12px; margin: 2px 0 10px; background: rgba(0,0,0,.04); border-radius: 12px; }
.public-banner .title { font-weight:500; font-size:16px; }
.public-banner .sub { font-size:12px; color: var(--muted); }

/* Utility */
.color-hidden { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.inline { display:flex; gap:8px; align-items:center; }
.muted { color: var(--muted); }
.spacer { flex:1; }

/* Accessibility focus (general hinting) */
button:focus-visible, [role="button"]:focus-visible, .icon-btn:focus-visible {
  outline: none; box-shadow: 0 0 0 3px rgba(125, 139, 255, .35);
}