/* Social Studio: select custom uploads, then arrange the post without changing the library. */
.social-custom-selection-bar{display:grid;gap:12px;margin:0 12px 12px;padding:14px;background:#f7f7f7;border:2px solid #111;border-left:6px solid var(--red)}
.social-custom-selection-bar[hidden]{display:none}
.social-custom-selection-bar>div:first-child{display:grid;gap:6px}
.social-custom-selection-bar b{font:900 16px 'Barlow Condensed',sans-serif}
.social-custom-selection-bar span{font:500 12px/1.5 Inter,system-ui,sans-serif;color:#555}
.social-custom-selection-bar>div:last-child{display:flex;gap:8px;flex-wrap:wrap}
.social-custom-selection-bar button{min-height:44px;width:auto;margin:0;padding:10px 12px;font-size:14px;box-shadow:none}
.social-library-item.selected{background:#fff0f1;box-shadow:inset 5px 0 0 var(--red)}
.social-library-item.selected>strong{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--red);color:#fff;font-size:18px}
.social-library-item:focus-visible,.social-custom-selection-bar button:focus-visible,#socialMediaOrder button:focus-visible{outline:3px solid #0076c0;outline-offset:3px}
#socialModalContent .social-media-order{margin:22px 0;padding:20px;border:2px solid #111;border-top:6px solid var(--red);background:#f7f7f7;min-width:0}
.social-media-order-head{display:flex;align-items:start;justify-content:space-between;gap:16px}
.social-media-order-head small{font:900 12px 'Barlow Condensed',sans-serif;letter-spacing:.08em;color:var(--red)}
.social-media-order-head h3{margin:4px 0 8px;font:900 italic 30px/1 'Barlow Condensed',sans-serif;text-transform:uppercase}
.social-media-order-head p{margin:0;font:500 13px/1.5 Inter,system-ui,sans-serif;color:#555}
.social-media-order-head>b{flex:none;padding:8px;background:#111;color:#fff;font:900 16px 'Barlow Condensed',sans-serif}
.social-media-order-list{display:flex;gap:14px;overflow-x:auto;list-style:none;margin:18px 0 8px;padding:4px 4px 12px;scroll-snap-type:x proximity}
.social-media-order-card{flex:0 0 158px;min-width:0;padding:0 0 8px;border:2px solid #ccc;background:#fff;scroll-snap-align:start}
.social-media-order-card[draggable="true"]{cursor:grab}
.social-media-order-card.dragging{opacity:.45}
.social-media-order-card.drop-target{border-color:var(--red);box-shadow:0 0 0 3px var(--red)}
.social-media-order-image{position:relative;background:#e4e4e4}
.social-media-order-image img,.social-media-order-image video{display:block;width:100%;height:140px;object-fit:contain}
.social-media-order-image>b{position:absolute;top:8px;left:8px;padding:5px 8px;background:#111;color:#fff;font:900 12px 'Barlow Condensed',sans-serif}
.social-media-order-card:first-child .social-media-order-image>b{background:var(--red)}
.social-media-order-card>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:10px 8px;font:700 12px Inter,system-ui,sans-serif}
.social-media-order-actions{display:flex;gap:4px;padding:0 8px}
#socialMediaOrder .social-media-order-actions button{flex:1;min-width:0;min-height:44px;margin:0;padding:6px;border:1px solid #bbb;background:#fff;color:#111;box-shadow:none;font:700 20px Inter,system-ui,sans-serif;cursor:pointer}
#socialMediaOrder .social-media-make-cover{width:calc(100% - 16px);min-height:44px;margin:6px 8px 0;padding:6px;border:1px solid #111;background:#111;color:#fff;box-shadow:none;font:800 13px 'Barlow Condensed',sans-serif;text-transform:uppercase;cursor:pointer}
#socialMediaOrder button:disabled{opacity:.35;cursor:default}
#socialMediaOrder button:not(:disabled):hover{background:var(--red);color:#fff;border-color:var(--red)}
.social-media-order-status{min-height:18px;margin:6px 0 0;font:500 12px/1.5 Inter,system-ui,sans-serif;color:#555}
.social-upload-drop.drag-over{border-color:var(--red);background:#fff0f1}
.social-upload-selection>div{gap:12px;align-items:center}
.social-upload-selection b{min-width:0;overflow-wrap:anywhere}
.social-upload-selection span{white-space:nowrap;margin-left:auto}
.social-upload-selection button{flex:none;min-height:44px;min-width:44px;margin:0;padding:4px;border:1px solid #666;background:#222;color:#fff;font-size:22px;box-shadow:none;cursor:pointer}
@media(max-width:560px){
  #socialModalContent .social-media-order{padding:12px}
  #socialModalContent .social-upload-drop{padding:20px 12px}
  #socialModalContent .social-composer-head h2{font-size:34px;line-height:1.05;overflow-wrap:break-word}
  .social-upload-selection>div{padding:10px}
  .social-media-order-head{gap:8px}
}