/* ==== jobcard-20261003: job-card maker panel inside the LinkedIn post builder ==== */
.li-modal.jc-wide{width:min(1180px,100%)}
.jc-cols{display:grid;grid-template-columns:minmax(0,1fr) 430px;flex:1;min-height:0;overflow:hidden}
.jc-cols>.li-body{min-height:0}
.jc-panel{border-left:1px solid var(--border);padding:12px 16px;overflow:auto;display:flex;flex-direction:column;gap:10px;background:var(--panel-2)}
.jc-panel>*{flex:none}
.jc-hd{display:flex;align-items:baseline;gap:8px}
.jc-hd b{font-size:.95rem}
.jc-prev{position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--border);background:#152332;aspect-ratio:1/1}
.jc-prev canvas{display:block;width:100%;height:100%}
.jc-busy{position:absolute;right:8px;bottom:8px;background:rgba(21,35,50,.75);color:#fff;font-size:.72rem;padding:3px 8px;border-radius:999px}
.jc-lays{display:flex;flex-wrap:wrap;gap:6px}
.jc-lay{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:999px;padding:6px 11px;font:inherit;font-size:.78rem;cursor:pointer}
.jc-lay.on{background:#152332;border-color:#152332;color:#fff;box-shadow:inset 0 -3px 0 #6BE0AD}
.jc-f{display:flex;flex-direction:column;gap:4px;font-size:.8rem}
.jc-f>span{font-weight:600}
.jc-f .q{width:100%;box-sizing:border-box}
.jc-pts{display:flex;flex-direction:column;gap:5px}
.jc-pt{display:flex;align-items:center;gap:6px}
.jc-pt input[type=checkbox]{flex:none;width:16px;height:16px;accent-color:#2B7FA3}
.jc-pt .q{flex:1;min-width:0;padding:6px 8px;font-size:.82rem}
.jc-namef{flex-direction:row;align-items:center;gap:8px}
.jc-namef .chk{white-space:nowrap;display:flex;align-items:center;gap:6px}
.jc-namef .q{flex:1}
.jc-warn{border:1px solid #fca5a5;background:color-mix(in srgb,#ef4444 10%,var(--panel));border-radius:8px;padding:8px 10px;font-size:.8rem}
.jc-acts{display:flex;gap:8px;flex-wrap:wrap}
.jc-acts .btn:disabled,#jc-png:disabled{opacity:.5;cursor:not-allowed}
.jc-tip{line-height:1.4}
.li-meta{flex-wrap:wrap}
@media (max-width:900px){
  .jc-cols{grid-template-columns:1fr;overflow:auto}
  .jc-cols>.li-body{overflow:visible}
  .jc-panel{border-left:0;border-top:1px solid var(--border);overflow:visible}
}
/* ==== jobcard-20261004: readable buttons in the LinkedIn post modal (light + dark) ==== */
.li-modal #li-mark{background:#0a66c2;border-color:#0a66c2;color:#fff}
.li-modal #li-mark:hover:not(:disabled){background:#004182;border-color:#004182;filter:none}
.li-modal #li-mark:focus-visible,.li-modal #jc-png:focus-visible{outline:2px solid #78C4E5;outline-offset:2px}
.li-modal #jc-png{background:#1F6F94;border-color:#1F6F94;color:#fff}
.li-modal #jc-png:hover:not(:disabled){background:#152332;border-color:#152332;filter:none}
.li-foot #li-mark:disabled,.li-modal #jc-png:disabled,.li-modal .btn:disabled{opacity:1;background:#e2e8f0;border-color:#cbd5e1;color:#475569;cursor:not-allowed}
html:not([data-theme=light]) .li-foot #li-mark:disabled,html:not([data-theme=light]) .li-modal #jc-png:disabled,html:not([data-theme=light]) .li-modal .btn:disabled{background:#1a2436;border-color:#2a3648;color:#a3b1c4}
html:not([data-theme=light]) .li-modal .cs-x{color:#fb7185;border-color:#fb7185}