/* Library and administration shell with shared search. */
.container.library-container {
  max-width: 1220px;
  padding: 32px 24px 40px;
  zoom: calc(1 / var(--app-zoom));
}
.library-search {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 61px;
  padding: 10px 16px 10px 20px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 2px 16px #0000001a;
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
}
.library-search__icon { display: block; flex: none; margin-right: 8px; }
.library-search .cl-search-input {
  flex: 1;
  min-width: 0;
  width: auto;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #425562;
  font: 500 16px/1.4 "Inter", "Segoe UI", Arial, sans-serif;
  box-shadow: none;
}
.library-search .cl-search-input::placeholder { color: #425562; opacity: 1; }
.library-search:focus-within { outline: 2px solid #0153cc; outline-offset: 2px; }
.library-search .cl-search-btn {
  position: static;
  flex: none;
  width: auto;
  height: 38px;
  padding: 12px 16px;
  border-radius: 8px;
  background: linear-gradient(251.16deg, #bb33ff, #3485fe);
  font: 600 16px/14px "Inter", "Segoe UI", Arial, sans-serif;
  transform: none;
}
.library-search .cl-search-btn:hover { filter: brightness(0.95); }
.library-search .cl-search-btn:focus-visible { outline: 2px solid #0153cc; outline-offset: 3px; }
.library-divider { height: 1px; margin: 24px 0; background: linear-gradient(90deg, #0153cc, #bb33ff, #00eeff); }
.library-layout { display: grid; grid-template-columns: 254px minmax(0, 1fr); gap: 24px; align-items: start; }
.library-results { min-width: 0; }
.library-results .tile-body { min-width: 0; overflow-wrap: anywhere; }
.library-playlist-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
@media (max-width: 1000px) {
  .library-results .tile-item { flex-wrap: wrap; }
  .library-results .tile-date { margin-left: auto; }
}
@media (max-width: 760px) {
  .container.library-container { padding: 24px 16px; }
  .library-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .library-search { gap: 10px; padding: 10px 12px; flex-wrap: wrap; }
  .library-search__icon { margin-right: 0; }
  .library-search .cl-search-input { flex-basis: calc(100% - 140px); }
  .library-playlist-actions { flex-wrap: wrap; }
  .library-playlist-actions .filter-tabs { flex-wrap: wrap; }
  .library-results .tile-thumb { width: 120px; height: 68px; }
}
