/**
 * outsourcenow.ai Pre-Sales Assistant — widget styles.
 * Self-contained; inherits brand tokens if present, falls back otherwise.
 */
.osn {
	--osn-bg:      #0c1019;
	--osn-bg-2:    #11151f;
	--osn-surface: #161b27;
	--osn-border:  #1f2633;
	--osn-text:    #e7ecf3;
	--osn-dim:     #9aa6b8;
	--osn-accent:  #00e6a8;
	--osn-accent2: #4d8dff;
	--osn-ink:     #05140f;
	--osn-body:    -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--osn-mono:    ui-monospace, "SF Mono", Menlo, monospace;
	position: fixed; right: 20px; bottom: 20px; z-index: 99998;
	font-family: var(--osn-body);
}

/* Launcher */
.osn__launcher {
	display: inline-flex; align-items: center; gap: 9px;
	padding: 13px 20px; border: none; border-radius: 100px; cursor: pointer;
	background: var(--osn-accent); color: var(--osn-ink);
	font-family: var(--osn-body); font-size: 15px; font-weight: 600;
	box-shadow: 0 10px 30px -8px rgba(0,230,168,.5); transition: transform .2s, box-shadow .2s;
}
.osn__launcher:hover { transform: translateY(-2px); box-shadow: 0 16px 40px -8px rgba(0,230,168,.6); }
.osn__launcher-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--osn-ink); opacity: .85; animation: osn-pulse 2s infinite; }
@keyframes osn-pulse { 0%,100%{opacity:.85} 50%{opacity:.3} }
.osn.is-open .osn__launcher { display: none; }

/* Panel */
.osn__panel {
	position: absolute; right: 0; bottom: 0; width: 380px; max-width: calc(100vw - 40px);
	height: 560px; max-height: calc(100vh - 40px);
	display: none; flex-direction: column; overflow: hidden;
	background: var(--osn-bg); color: var(--osn-text);
	border: 1px solid var(--osn-border); border-radius: 18px;
	box-shadow: 0 30px 70px -20px rgba(0,0,0,.7);
}
.osn.is-open .osn__panel { display: flex; animation: osn-in .25s var(--osn-body); }
@keyframes osn-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

.osn__preview {
	background: rgba(77,141,255,.12); color: var(--osn-accent2);
	font-size: 11px; text-align: center; padding: 5px; font-family: var(--osn-mono);
	border-bottom: 1px solid var(--osn-border);
}

.osn__bar {
	display: flex; align-items: center; gap: 9px; padding: 14px 16px;
	background: var(--osn-bg-2); border-bottom: 1px solid var(--osn-border);
}
.osn__status { width: 8px; height: 8px; border-radius: 50%; background: var(--osn-accent); box-shadow: 0 0 8px var(--osn-accent); }
.osn__title { font-weight: 600; font-size: 15px; flex: 1; }
.osn__badge { font-family: var(--osn-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--osn-dim); border: 1px solid var(--osn-border); border-radius: 5px; padding: 2px 6px; }
.osn__close { background: none; border: none; color: var(--osn-dim); font-size: 22px; line-height: 1; cursor: pointer; padding: 0 2px; }
.osn__close:hover { color: var(--osn-text); }

/* Log */
.osn__log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.osn__msg { max-width: 82%; padding: 11px 14px; border-radius: 14px; font-size: 14.5px; line-height: 1.5; white-space: pre-wrap; word-wrap: break-word; }
.osn__msg--bot { align-self: flex-start; background: var(--osn-surface); border: 1px solid var(--osn-border); border-bottom-left-radius: 5px; }
.osn__msg--user { align-self: flex-end; background: var(--osn-accent); color: var(--osn-ink); border-bottom-right-radius: 5px; font-weight: 500; }
.osn__msg a { color: var(--osn-accent); }
.osn__consent { font-size: 12px; color: var(--osn-dim); line-height: 1.5; padding: 2px; }

.osn__typing { align-self: flex-start; display: inline-flex; gap: 4px; padding: 12px 14px; background: var(--osn-surface); border: 1px solid var(--osn-border); border-radius: 14px; border-bottom-left-radius: 5px; }
.osn__typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--osn-dim); animation: osn-bounce 1.2s infinite; }
.osn__typing span:nth-child(2){ animation-delay:.15s } .osn__typing span:nth-child(3){ animation-delay:.3s }
@keyframes osn-bounce { 0%,60%,100%{ transform: translateY(0); opacity:.5 } 30%{ transform: translateY(-5px); opacity:1 } }

/* Composer */
.osn__form { display: flex; gap: 8px; padding: 12px; border-top: 1px solid var(--osn-border); background: var(--osn-bg-2); }
.osn__input {
	flex: 1; resize: none; max-height: 110px; padding: 11px 13px;
	background: var(--osn-bg); border: 1px solid var(--osn-border); border-radius: 10px;
	color: var(--osn-text); font-family: var(--osn-body); font-size: 14.5px; line-height: 1.4;
}
.osn__input:focus { outline: none; border-color: var(--osn-accent); box-shadow: 0 0 0 3px rgba(0,230,168,.12); }
.osn__send {
	flex: 0 0 auto; width: 44px; border: none; border-radius: 10px; cursor: pointer;
	background: var(--osn-accent); color: var(--osn-ink); font-size: 18px; font-weight: 700;
	transition: transform .15s;
}
.osn__send:hover { transform: translateY(-1px); }
.osn__send:disabled { opacity: .5; cursor: default; transform: none; }

/* Footer / lead form */
.osn__foot { padding: 0 14px 12px; }
.osn__leadcta { background: none; border: none; color: var(--osn-accent); font-size: 12.5px; cursor: pointer; padding: 4px 0; text-decoration: underline; text-underline-offset: 2px; font-family: var(--osn-body); }
.osn__lead { display: none; flex-direction: column; gap: 8px; margin-top: 8px; }
.osn__lead.is-open { display: flex; }
.osn__lead input, .osn__lead textarea {
	width: 100%; padding: 9px 11px; background: var(--osn-bg); border: 1px solid var(--osn-border);
	border-radius: 8px; color: var(--osn-text); font-family: var(--osn-body); font-size: 13.5px;
}
.osn__lead input:focus, .osn__lead textarea:focus { outline: none; border-color: var(--osn-accent); }
.osn__lead textarea { resize: vertical; min-height: 56px; }
.osn__lead button {
	padding: 10px; border: none; border-radius: 8px; cursor: pointer;
	background: var(--osn-accent); color: var(--osn-ink); font-weight: 600; font-size: 13.5px;
}
.osn__hp { position: absolute; left: -9999px; }
.osn__note { font-size: 12px; color: var(--osn-accent); padding: 4px 0; }
