/* The account's own image library, and the picker the product form reuses. */

.bmw-media .bmw-acct-grid{align-items:start}
.bmw-media-grid-card{grid-column:span 2}
.bmw-media-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:14px}
.bmw-media-head .bmw-acct-card-h{margin:0}
.bmw-media-head em{font-style:normal;color:#78857c;font-weight:400;font-size:13px}

.bmw-media-filters{display:flex;flex-wrap:wrap;gap:6px}
.bmw-media-filters a{padding:6px 12px;border:1px solid #dce5dc;border-radius:30px;font:400 12.5px/1.3 'DM Sans',sans-serif;color:#33443a;text-decoration:none;background:#fbfcf8}
.bmw-media-filters a:hover{border-color:#b9cfbc}
.bmw-media-filters a.is-on{background:#1f6b4a;border-color:#1f6b4a;color:#fff}

.bmw-media-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}
.bmw-media-grid>li{border:1px solid #dce5dc;border-radius:12px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
.bmw-media-grid img{width:100%;height:140px;object-fit:cover;display:block;background:#f2f5ee}
.bmw-media-meta{padding:10px 12px 12px;display:grid;gap:8px}
.bmw-media-cats{font-size:11px;color:#627369;overflow-wrap:anywhere}
.bmw-media-cats em{font-style:normal;color:#9aa79e}
.bmw-media-meta form{display:flex;gap:8px;align-items:center}
.bmw-media-meta input[type=text]{flex:1;min-width:0;border:1px solid #dce5dc;border-radius:8px;padding:7px 9px;font:400 12px/1.4 'DM Sans',sans-serif}
.bmw-media-del{color:#9b2c2c}

/* the picker, inside the product form */
.bmw-media-picker ul{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:10px}
.bmw-media-picker label{display:block;position:relative;cursor:pointer;border:2px solid #dce5dc;border-radius:10px;overflow:hidden;line-height:0}
.bmw-media-picker img{width:100%;height:78px;object-fit:cover}
.bmw-media-picker input{position:absolute;top:6px;left:6px;margin:0;width:16px;height:16px;accent-color:#1f6b4a;z-index:1}
.bmw-media-picker label:has(input:checked){border-color:#1f6b4a;box-shadow:0 0 0 3px rgba(31,107,74,.14)}
.bmw-media-picker label:focus-within{outline:2px solid #84b491;outline-offset:2px}

@media(max-width:900px){.bmw-media-grid-card{grid-column:auto}}
