:root{
  --nl-unify-surface: rgba(227,236,242,.96);
  --nl-unify-surface-strong: #ffffff;
  --nl-unify-border: rgba(15,24,33,.10);
  --nl-unify-shadow: 0 16px 40px rgba(15,23,42,.11);
  --nl-unify-field-shadow: 0 1px 0 rgba(255,255,255,.65) inset;
}

body.cm-brand-neolinkd.cm-light #main-content .cm-card,
body.cm-brand-neolinkd.cm-light #main-content .cm-panel,
body.cm-brand-neolinkd.cm-light #main-content .cm-box,
body.cm-brand-neolinkd.cm-light #main-content .cm-widget,
body.cm-brand-neolinkd.cm-light #main-content .card,
body.cm-brand-neolinkd.cm-light #main-content .svara-card,
body.cm-brand-neolinkd.cm-light #main-content .cm-need-detail-card,
body.cm-brand-neolinkd.cm-light #main-content .cm-chat-messages,
body.cm-brand-neolinkd.cm-light #main-content .cm-chat-form-wrap,
body.cm-brand-neolinkd.cm-light #main-content .cap-card,
body.cm-brand-neolinkd.cm-light #main-content .cap-view-card,
body.cm-brand-neolinkd.cm-light #main-content .cap-view-panel,
body.cm-brand-neolinkd.cm-light #main-content .cap-chat-card,
body.cm-brand-neolinkd.cm-light #main-content .cap-chat-panel,
body.cm-brand-neolinkd.cm-light #main-content .section.container > form.cm-form{
  background: var(--nl-unify-surface) !important;
  border: 1px solid var(--nl-unify-border) !important;
  box-shadow: var(--nl-unify-shadow) !important;
}

body.cm-brand-neolinkd.cm-light #main-content .cm-chat-messages,
body.cm-brand-neolinkd.cm-light #main-content .cm-chat-form-wrap,
body.cm-brand-neolinkd.cm-light #main-content .cap-chat-panel,
body.cm-brand-neolinkd.cm-light #main-content .cap-view-panel,
body.cm-brand-neolinkd.cm-light #main-content .cap-card,
body.cm-brand-neolinkd.cm-light #main-content .svara-card,
body.cm-brand-neolinkd.cm-light #main-content .cm-need-detail-card{
  color: var(--nl-text, #0e1722) !important;
}

body.cm-brand-neolinkd.cm-light #main-content input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
body.cm-brand-neolinkd.cm-light #main-content select,
body.cm-brand-neolinkd.cm-light #main-content textarea,
body.cm-brand-neolinkd.cm-light #main-content .cm-input,
body.cm-brand-neolinkd.cm-light #main-content .cm-select,
body.cm-brand-neolinkd.cm-light #main-content .cm-textarea,
body.cm-brand-neolinkd.cm-light #main-content .cap-inp,
body.cm-brand-neolinkd.cm-light #main-content .cap-chat-textarea,
body.cm-brand-neolinkd.cm-light #main-content .cm-need-note-box,
body.cm-brand-neolinkd.cm-light #main-content .cm-note,
body.cm-brand-neolinkd.cm-light #main-content .cap-view-msg,
body.cm-brand-neolinkd.cm-light #main-content .cap-chat-empty,
body.cm-brand-neolinkd.cm-light #main-content .cm-chat-empty,
body.cm-brand-neolinkd.cm-light #main-content .cm-chat-bubble.them{
  background: var(--nl-unify-surface-strong) !important;
  color: var(--nl-text, #0e1722) !important;
  border: 1px solid rgba(15,24,33,.12) !important;
  box-shadow: var(--nl-unify-field-shadow) !important;
}

body.cm-brand-neolinkd.cm-light #main-content .cm-chat-empty,
body.cm-brand-neolinkd.cm-light #main-content .cap-chat-empty,
body.cm-brand-neolinkd.cm-light #main-content .cm-need-note-box,
body.cm-brand-neolinkd.cm-light #main-content .cap-view-msg{
  border-radius: 18px !important;
}

body.cm-brand-neolinkd.cm-light #main-content .cm-chat-bubble.them,
body.cm-brand-neolinkd.cm-light #main-content .cm-chat-bubble.me{
  max-width: min(82%, 560px);
}

body.cm-brand-neolinkd.cm-light #main-content .cm-chat-bubble.them{
  color: var(--nl-text, #0e1722) !important;
}

body.cm-brand-neolinkd.cm-light #main-content .cm-input::placeholder,
body.cm-brand-neolinkd.cm-light #main-content .cm-textarea::placeholder,
body.cm-brand-neolinkd.cm-light #main-content input::placeholder,
body.cm-brand-neolinkd.cm-light #main-content textarea::placeholder{
  color: rgba(14,23,34,.48) !important;
  opacity: 1 !important;
}

body.cm-brand-neolinkd.cm-light #main-content .cm-input:focus,
body.cm-brand-neolinkd.cm-light #main-content .cm-select:focus,
body.cm-brand-neolinkd.cm-light #main-content .cm-textarea:focus,
body.cm-brand-neolinkd.cm-light #main-content input:focus,
body.cm-brand-neolinkd.cm-light #main-content select:focus,
body.cm-brand-neolinkd.cm-light #main-content textarea:focus,
body.cm-brand-neolinkd.cm-light #main-content .cap-chat-textarea:focus{
  border-color: rgba(77,141,157,.55) !important;
  box-shadow: 0 0 0 3px rgba(77,141,157,.18) !important;
  outline: none !important;
}

body.cm-brand-neolinkd.cm-light #main-content .section.container > form.cm-form{
  margin-top: 20px;
  padding: 22px 22px 24px;
  border-radius: 24px;
}

body.cm-brand-neolinkd.cm-light #main-content .section.container > form.cm-form .grid-2,
body.cm-brand-neolinkd.cm-light #main-content .section.container > form.cm-form .actions{
  position: relative;
  z-index: 1;
}

body.cm-brand-neolinkd.cm-light #main-content .cap-chat-bubble.me,
body.cm-brand-neolinkd.cm-light #main-content .cm-chat-message--me .cm-chat-bubble{
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* ------------------------------------------------------------
   Patch 1: Kapacitet → Svar jag skickat (cm-tab-capacity_sent)
   Fixar röriga/överlappande actions-knappar (Visa svar / Öppna chatt / Markera avslutat)
------------------------------------------------------------- */
@media (min-width: 821px){
  body.cm-brand-neolinkd.cm-light #main-content .cm.cm-tab-capacity_sent .need-pane .head{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: start !important;
    gap: 12px !important;
  }
  body.cm-brand-neolinkd.cm-light #main-content .cm.cm-tab-capacity_sent .need-pane .actions{
    justify-content: flex-end !important;
    align-content: flex-start !important;
    gap: 10px !important;
    max-width: 520px !important;
  }
  body.cm-brand-neolinkd.cm-light #main-content .cm.cm-tab-capacity_sent .need-pane .actions form{
    display: inline-flex !important;
    margin: 0 !important;
  }
  body.cm-brand-neolinkd.cm-light #main-content .cm.cm-tab-capacity_sent .need-pane .actions > .badge{
    order: 50;
  }
}

/* ------------------------------------------------------------
   Patch 2: Stabilitet (minska layout-hopp mellan listflikar)
   Enhetlig min-höjd på card-head i kapacitetsflikar med actions
------------------------------------------------------------- */
body.cm-brand-neolinkd.cm-light #main-content .cm.cm-tab-capacity_inbox .need-pane .card,
body.cm-brand-neolinkd.cm-light #main-content .cm.cm-tab-capacity_sent .need-pane .card{
  min-height: 146px !important;
}
body.cm-brand-neolinkd.cm-light #main-content .cm.cm-tab-capacity_inbox .need-pane .head,
body.cm-brand-neolinkd.cm-light #main-content .cm.cm-tab-capacity_sent .need-pane .head{
  min-height: 118px !important;
}