.sidebar-nav #nav-instagram-connect { order:33; }
#instagram-connect-view { min-width:0; color:#f3f0e9; }
#instagram-connect-view [hidden] { display:none!important; }
#instagram-connect-view .content-card { min-width:0; padding:18px; background:#181b21; color:#f3f0e9; }
#instagram-connect-view h2 { margin:0 0 12px; font-size:20px; line-height:1.5; color:inherit; }
#instagram-connect-view .customer-actions,#ig-connect-fallback { display:flex; flex-wrap:wrap; gap:10px; min-width:0; }
#instagram-connect-view button,#instagram-connect-view a { box-sizing:border-box; max-width:100%; min-height:42px; padding:10px 16px; font:inherit; line-height:1.5; white-space:normal; overflow-wrap:anywhere; }
#instagram-connect-view .primary-btn { background:#f5c26b!important; color:#211a11!important; -webkit-text-fill-color:#211a11!important; border:1px solid #f5c26b; }
#instagram-connect-view .ghost-btn { background:#242a33; color:#f3f0e9; border:1px solid #727982; text-decoration:none; }
#instagram-connect-view .danger-btn { background:#a32125; color:#fff; border:1px solid #d45559; }
#instagram-connect-view button:disabled { opacity:.65; cursor:not-allowed; }
#instagram-connect-view :is(button,a):focus-visible { outline:3px solid #66cfff; outline-offset:3px; }
#instagram-connect-view .status-text { color:#d6dae1; line-height:1.65; overflow-wrap:anywhere; }
/* Claude (review): an error asks the member to do something, so it stands out from the ordinary status line. The shared
   ui-theme-mode.css forces every .view-panel .status-text to 12px grey with !important, hence !important here too. */
#instagram-connect-view .status-text[data-kind="error"] { color:#ffb9bc!important; font-size:15px!important; line-height:1.6!important; font-weight:600; padding:8px 12px; border-left:3px solid #d45559; border-radius:6px; background:#2b1b1e; }
#instagram-connect-view .ig-help { padding-left:24px; margin:12px 0 0; color:#d6dae1; font-size:14px; line-height:1.65; }
#instagram-connect-view .ig-help li+li { margin-top:6px; }
#ig-connect-fallback:not(:empty) { margin:12px 0; }
#ig-connect-accounts { display:grid; gap:14px; min-width:0; }
#instagram-connect-view .empty-state { color:#d6dae1; background:transparent; }
#instagram-connect-view .ig-account { min-width:0; padding:14px; border:1px solid #626a77; border-radius:12px; background:#20252d; }
#instagram-connect-view .ig-identity { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; min-width:0; }
#instagram-connect-view .ig-username { display:block; max-width:100%; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:17px; }
#instagram-connect-view .ig-type { color:#d6dae1; }
#instagram-connect-view .ig-badge { border:1px solid #5bb9a1; border-radius:20px; padding:3px 10px; background:#153c32; color:#b6f4df; font-size:13px; line-height:1.6; }
#instagram-connect-view .ig-badge.ig-reconnect { border-color:#b79b63; background:#423218; color:#ffe0a1; }
#instagram-connect-view .ig-details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:12px 0; font-size:14px; line-height:1.65; }
#instagram-connect-view .ig-details>div { min-width:0; overflow-wrap:anywhere; }
#instagram-connect-view dt { color:#c5cbd4; }
#instagram-connect-view dd { margin:4px 0 0; color:inherit; }
#instagram-connect-view .ig-account-actions { display:flex; flex-wrap:wrap; gap:10px; }
html[data-theme="light"] #instagram-connect-view { color:#252932; }
/* The shared light theme paints gold buttons with white text using !important. */
html[data-theme="light"] #instagram-connect-view .primary-btn { color:#211a11!important; -webkit-text-fill-color:#211a11!important; }
html[data-theme="light"] #instagram-connect-view .content-card { background:#fff; color:#252932; }
html[data-theme="light"] #instagram-connect-view :is(.status-text,.ig-help,.ig-type,.empty-state,dt) { color:#485260; }
html[data-theme="light"] #instagram-connect-view .status-text[data-kind="error"] { color:#9a2027!important; background:#fdecec; border-left-color:#c2343b; }
html[data-theme="light"] #instagram-connect-view .ghost-btn { background:#f2f4f7; color:#252932; border-color:#667180; }
html[data-theme="light"] #instagram-connect-view .ig-account { background:#f5f7fa; border-color:#7d8795; }
html[data-theme="light"] #instagram-connect-view .ig-badge { background:#e3f3ea; color:#17563b; border-color:#478063; }
html[data-theme="light"] #instagram-connect-view .ig-badge.ig-reconnect { background:#fff0cf; color:#704907; border-color:#98751e; }
body.mobile-mode #instagram-connect-view .view-action-bar { height:auto; min-width:0; }
body.mobile-mode #instagram-connect-view .view-action-spacer { display:none; }
body.mobile-mode #instagram-connect-view .customer-actions { width:100%; }
body.mobile-mode #instagram-connect-view .content-card { padding:16px; }
body.mobile-mode #instagram-connect-view .ig-help { font-size:16px; }
body.mobile-mode #instagram-connect-view .ig-details { grid-template-columns:minmax(0,1fr); }
body.mobile-mode #instagram-connect-view .ig-identity { align-items:flex-start; flex-direction:column; }