/* "Not connected on LinkedIn" sheet (js/linkedin-connect-modal.js). Day + Night tokens live here.
 * Sits above the inbox panel drawer (z 9999). */
.lcm-ov {
  --lcm-bg: rgba(255, 255, 255, .86);
  --lcm-edge: rgba(15, 23, 42, .08);
  --lcm-hi: rgba(255, 255, 255, .95);
  --lcm-ink: #0F172A;
  --lcm-sub: #64748B;
  --lcm-field: rgba(15, 23, 42, .035);
  --lcm-field-edge: rgba(15, 23, 42, .09);
  --lcm-teal: #0D9488;
  --lcm-teal-2: #0F766E;
  --lcm-teal-soft: rgba(13, 148, 136, .1);
  --lcm-li: #0A66C2;
  --lcm-li-soft: rgba(10, 102, 194, .1);
  --lcm-scrim: rgba(15, 23, 42, .34);
  --lcm-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 28px 70px -16px rgba(15, 23, 42, .38);

  position: fixed; inset: 0; z-index: 10050;
  display: flex; align-items: center; justify-content: center; padding: 16px;
  background: var(--lcm-scrim);
  -webkit-backdrop-filter: blur(0px); backdrop-filter: blur(0px);
  opacity: 0;
  transition: opacity .24s ease, backdrop-filter .3s ease, -webkit-backdrop-filter .3s ease;
  font-family: var(--font-family, system-ui, sans-serif);
}
.lcm-ov.is-in { opacity: 1; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.lcm-ov.is-out { opacity: 0; pointer-events: none; }

.lcm {
  position: relative;
  width: 420px; max-width: 100%;
  padding: 26px 24px 20px;
  border-radius: 24px;
  background: var(--lcm-bg);
  -webkit-backdrop-filter: blur(28px) saturate(180%); backdrop-filter: blur(28px) saturate(180%);
  border: 1px solid var(--lcm-edge);
  box-shadow: inset 0 1px 0 var(--lcm-hi), var(--lcm-shadow);
  color: var(--lcm-ink);
  transform: translateY(12px) scale(.965); filter: blur(4px);
  transition: transform .5s cubic-bezier(.2, .8, .2, 1), filter .35s ease;
}
.lcm-ov.is-in .lcm { transform: none; filter: none; }
.lcm-ov.is-out .lcm { transform: translateY(8px) scale(.975); transition-duration: .22s; }

.lcm__x {
  position: absolute; top: 14px; right: 14px;
  width: 30px; height: 30px; border-radius: 50%;
  display: grid; place-items: center;
  border: 0; background: transparent; color: var(--lcm-sub); cursor: pointer;
  transition: background .2s ease, color .2s ease, transform .12s ease;
}
.lcm__x svg { width: 14px; height: 14px; }
.lcm__x:hover { background: var(--lcm-field); color: var(--lcm-ink); }
.lcm__x:active { transform: scale(.9); }

.lcm__badge {
  width: 44px; height: 44px; border-radius: 14px;
  display: grid; place-items: center;
  background: var(--lcm-li-soft); color: var(--lcm-li);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5);
}
.lcm__badge svg { width: 20px; height: 20px; }

.lcm__title {
  margin: 16px 0 6px; font-size: 19px; line-height: 1.2; font-weight: 650; letter-spacing: -.018em;
  color: var(--lcm-ink);
}
.lcm__lead { margin: 0; font-size: 14px; line-height: 1.55; color: var(--lcm-sub); }

.lcm__field { position: relative; display: block; margin-top: 18px; }
.lcm__label {
  display: block; margin-bottom: 6px;
  font-size: 12px; font-weight: 600; letter-spacing: .01em; color: var(--lcm-ink);
}
.lcm__label em { font-style: normal; font-weight: 500; color: var(--lcm-sub); margin-left: 4px; }
.lcm__note {
  width: 100%; box-sizing: border-box; resize: none;
  padding: 12px 14px 26px; border-radius: 14px;
  font: inherit; font-size: 14px; line-height: 1.5; color: var(--lcm-ink);
  background: var(--lcm-field);
  border: 1px solid var(--lcm-field-edge);
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.lcm__note::placeholder { color: var(--lcm-sub); opacity: .75; }
.lcm__note:focus { border-color: var(--lcm-teal); box-shadow: 0 0 0 4px var(--lcm-teal-soft); }
.lcm__count {
  position: absolute; right: 12px; bottom: 9px;
  font-size: 11px; font-variant-numeric: tabular-nums; color: var(--lcm-sub);
}

.lcm__actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 20px; }
.lcm__actions--single { justify-content: center; }
.lcm__btn {
  height: 40px; padding: 0 18px; border-radius: 12px;
  font: inherit; font-size: 14px; font-weight: 600; letter-spacing: -.005em;
  cursor: pointer; border: 1px solid transparent;
  transition: transform .12s ease, background .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.lcm__btn:active { transform: scale(.97); }
.lcm__btn--ghost { background: transparent; color: var(--lcm-sub); border-color: var(--lcm-field-edge); }
.lcm__btn--ghost:hover { background: var(--lcm-field); color: var(--lcm-ink); }
.lcm__btn--primary {
  color: #fff;
  background: linear-gradient(180deg, var(--lcm-teal) 0%, var(--lcm-teal-2) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 6px 16px -6px rgba(13, 148, 136, .6);
}
.lcm__btn--primary:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 8px 22px -6px rgba(13, 148, 136, .7); }
.lcm__btn.is-busy, .lcm__btn:disabled { opacity: .7; cursor: default; }

.lcm__pill {
  display: inline-flex; align-items: center; gap: 6px;
  height: 40px; padding: 0 16px; border-radius: 999px;
  font-size: 13px; font-weight: 600; color: var(--lcm-teal); background: var(--lcm-teal-soft);
}
.lcm__pill svg { width: 15px; height: 15px; }

.lcm__done { text-align: center; padding: 6px 4px 0; }
.lcm__done-mark {
  width: 52px; height: 52px; margin: 0 auto; border-radius: 50%;
  display: grid; place-items: center;
  color: #fff; background: linear-gradient(180deg, var(--lcm-teal) 0%, var(--lcm-teal-2) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 10px 26px -8px rgba(13, 148, 136, .7);
  animation: lcm-pop .55s cubic-bezier(.2, .8, .2, 1);
}
.lcm__done-mark svg { width: 24px; height: 24px; }
@keyframes lcm-pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }

html.theme-night .lcm-ov {
  --lcm-bg: rgba(20, 30, 34, .82);
  --lcm-edge: rgba(255, 255, 255, .09);
  --lcm-hi: rgba(255, 255, 255, .07);
  --lcm-ink: #E8F0EF;
  --lcm-sub: #93A5A3;
  --lcm-field: rgba(255, 255, 255, .04);
  --lcm-field-edge: rgba(255, 255, 255, .1);
  --lcm-teal: #14B8A6;
  --lcm-teal-2: #0D9488;
  --lcm-teal-soft: rgba(45, 212, 191, .14);
  --lcm-li: #5AA7F2;
  --lcm-li-soft: rgba(90, 167, 242, .14);
  --lcm-scrim: rgba(2, 8, 10, .55);
  --lcm-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 28px 70px -14px rgba(0, 0, 0, .7);
}
html.theme-night .lcm__badge { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06); }
html.theme-night .lcm__btn--primary { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 0 18px -4px rgba(45, 212, 191, .55); }
html.theme-night .lcm__pill { color: #2DD4BF; }

@media (max-width: 480px) {
  .lcm { padding: 22px 18px 18px; border-radius: 22px; }
  .lcm__actions { flex-direction: column-reverse; align-items: stretch; }
  .lcm__btn, .lcm__pill { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .lcm, .lcm-ov.is-out .lcm { transform: none; filter: none; transition: none; }
  .lcm__done-mark { animation: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .lcm { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
  html.theme-night .lcm { background: #16211F; }
  .lcm-ov.is-in { -webkit-backdrop-filter: none; backdrop-filter: none; }
}
