/* Model library picker (left column of My Models) — tokens from voiceiq-ui.css */

/* Segmented library tabs (same recipe as .admin-tabs in the base) */
.library-tabs{display:flex;gap:4px;padding:4px;margin-bottom:20px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2)}
.library-tabs button{flex:1 1 auto;min-height:38px;padding:0 12px;border:1px solid transparent;border-radius:999px;background:transparent;color:var(--muted);font:inherit;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}
.library-tabs button:hover{color:var(--text)}
.library-tabs button[aria-pressed=true]{background:var(--surface);border-color:var(--line);color:var(--text);box-shadow:none}

.my-library .library-section[hidden]{display:none}
.my-library .library-section+.library-section{margin:0;padding:0;border:0}
.my-library .kicker{display:none}
.my-library .library-section-head{align-items:center;margin-bottom:12px}
.my-library .library-section-head h3{font-size:18px;margin:0;letter-spacing:-.02em}
.my-library #restoreMessage:empty{display:none}

/* Scrollable tile grid */
.my-library .owned-list{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:96px;align-content:start;gap:10px;margin-top:14px;height:310px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:auto;scrollbar-width:none;padding:3px}
.my-library .owned-list::-webkit-scrollbar{display:none}
.my-library .owned-list:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.my-library .owned-card{min-height:0;padding:12px;border-radius:var(--radius);box-shadow:none;transform:none;background:var(--bg)}
.my-library .owned-card:hover{background:var(--surface-2)}
.my-library .owned-card.active{background:var(--accent-soft);border-color:var(--accent)}
.my-library .owned-card-head{height:100%;align-items:flex-start;justify-content:space-between;flex-direction:column;gap:5px}
.my-library .owned-card strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;overflow-wrap:normal;word-break:normal}
.my-library .owned-card small{display:none}
.my-library .owned-badge{border:0;padding:0;background:transparent;font-size:11px;font-weight:600;color:var(--faint)}
.my-library .owned-badge span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.my-library .owned-badge .pin-icon{flex-shrink:0}
.my-library .owned-empty{grid-column:1/-1;margin:0;padding:30px 14px;line-height:1.6}
.library-tabs button:focus-visible,.owned-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* Plus-pinned voices: flat accent treatment (works in both themes via tokens) */
.my-library .owned-card.plus-pinned,.voice-entry.plus-pinned{background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}
.my-library .owned-card.plus-pinned:hover{background:var(--accent-soft);border-color:var(--accent)}
.my-library .owned-card.plus-pinned.active{border-color:var(--accent);box-shadow:var(--ring)}
.my-library .plus-pinned .owned-badge{display:flex;gap:4px;align-items:flex-start;color:var(--accent-text);line-height:1.35;font-size:11px;overflow-wrap:normal;word-break:normal}
.pin-icon{width:12px;height:12px;flex:0 0 12px;margin-top:1px}

.my-layout:has(#ownedLibraryTab[aria-pressed="true"]) #pinPublicModel{display:none}

/* Favourite star overlay on tiles */
.my-library .favorite-model-row{position:relative;display:block;min-width:0;height:100%}
.my-library .favorite-model-row .owned-card{width:100%;height:100%;padding:12px 30px 12px 12px}
.my-library .favorite-model-row>.model-star{position:absolute;right:4px;top:6px;padding:4px;font-size:19px;line-height:1;z-index:2}

@media(min-width:901px){.my-layout{grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr)}.my-workspace{position:static}}
@media(max-width:600px){.my-library .owned-list{grid-template-columns:repeat(2,minmax(0,1fr));height:306px}.library-tabs button{padding:0 8px;font-size:12px}}
