#malisafi-public-widget{position:fixed;right:16px;bottom:18px;left:auto;z-index:99999;font-family:inherit}
#malisafi-public-widget .malisafi-widget-toggle{
	background:#0b3d91; /* dark blue */
	color:#fff; border:none; padding:8px 12px; border-radius:20px; cursor:pointer; display:flex; align-items:center; gap:8px; font-weight:600;
}
#malisafi-public-widget .malisafi-widget-toggle.open{border-bottom-left-radius:0;border-bottom-right-radius:0}
#malisafi-public-widget .malisafi-widget-panel{width:360px;max-height:70vh;background:#fff;border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,0.12);overflow:hidden;display:flex;flex-direction:column;margin-top:8px;}
#malisafi-public-widget .malisafi-widget-messages{flex:1;min-height:120px;overflow:auto;padding:12px;background:#fafafa}
#malisafi-public-widget .malisafi-widget-form{padding:10px;display:flex;flex-direction:column;gap:6px;flex:none}
#malisafi-public-widget input,#malisafi-public-widget textarea{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px}
#malisafi-public-widget .malisafi-widget-actions{text-align:right}
#malisafi-public-widget .msg{margin-bottom:8px}
#malisafi-public-widget .msg .msg-sender{font-weight:600;font-size:12px;color:#333}
#malisafi-public-widget .msg .msg-body{font-size:13px;color:#222}
#malisafi-public-widget .msg.agent{background:#eef9f3;padding:6px;border-radius:4px}
#malisafi-public-widget .msg.client{background:#ffffff;padding:6px;border-radius:4px}

/* Unread badge */
#malisafi-public-widget .malisafi-widget-badge{background:#e74c3c;color:#fff;padding:2px 6px;border-radius:12px;font-size:12px;margin-left:8px;display:inline-block}

/* Minimized state: small circular button */
#malisafi-public-widget.malisafi-widget-min{right:12px;bottom:12px}
#malisafi-public-widget.malisafi-widget-min .malisafi-widget-toggle{border-radius:50%;width:56px;height:56px;padding:0;display:flex;align-items:center;justify-content:center}
#malisafi-public-widget.malisafi-widget-min .malisafi-widget-toggle .chat-label{display:none}

/* Ensure label has readable spacing when expanded */
.malisafi-widget-toggle .chat-label{font-size:13px;line-height:1}
#malisafi-public-widget.malisafi-widget-min .malisafi-widget-toggle .chat-icon{font-size:20px}
/* Additional styles */
.malisafi-input-row textarea { flex:1; min-height:40px; max-height:160px; padding:10px; border-radius:8px; border:1px solid #e6e6e6; resize:none; font-size:14px; }
.malisafi-send {
	background:#0b3d91; /* dark blue */
	color:#fff; border:none; padding:8px 12px; border-radius:8px; cursor:pointer;
	display:inline-flex; align-items:center; gap:8px; font-weight:600;
}
.malisafi-send::before{
	content:"\2708"; /* paper plane glyph */
	display:inline-block; font-size:14px; line-height:1; transform:translateY(-1px);
}
.malisafi-send:hover{ filter:brightness(1.05); }
.malisafi-send:focus{ outline:2px solid rgba(11,61,145,0.2); }
.malisafi-send[disabled] { opacity:0.55; cursor:default; filter:none; }
.malisafi-start { background:var(--mls-accent); color:#fff; border:none; padding:8px 12px; border-radius:8px; cursor:pointer; width:100%; }
.malisafi-start-row { display:block; }
.malisafi-widget-form input[type=tel] { -webkit-appearance: none; }

/* Specific styling for the Start chat button: white background, dark-orange text/border */
#malisafi-widget-start,
.malisafi-start {
	background: #ffffff !important;
	color: #c04e00 !important; /* copilot dark orange variant */
	border: 1px solid #c04e00 !important;
	box-shadow: none;
}
#malisafi-widget-start:hover,
.malisafi-start:hover {
	background: #fff;
	filter: brightness(0.98);
}
#malisafi-widget-start:focus,
.malisafi-start:focus {
	outline: 2px solid rgba(192,78,0,0.12);
}

/* Message bubbles */
.msg { display:flex; align-items:flex-end; gap:8px; margin-bottom:6px; }
.msg .avatar { width:28px; height:28px; border-radius:50%; background:#cfd8dc; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:600; font-size:12px; }
.msg .bubble { max-width:72%; position:relative; }
.msg.client { flex-direction:row-reverse; }
.msg.client .bubble { background:#DCF8C6; color:#072d12; border-radius:18px 18px 4px 18px; padding:8px 10px; }
.msg.client .bubble::after{ content:''; position:absolute; right:-6px; bottom:6px; width:12px; height:12px; background:#DCF8C6; transform:rotate(45deg); border-radius:2px; box-shadow:-1px -1px 0 rgba(0,0,0,0.02); }
.msg.agent .bubble { background:#ffffff; color:#111; border-radius:18px 18px 18px 4px; padding:8px 10px; border:1px solid rgba(0,0,0,0.06); }
.msg.agent .bubble::after{ content:''; position:absolute; left:-6px; bottom:6px; width:12px; height:12px; background:#ffffff; transform:rotate(45deg); border-radius:2px; box-shadow:1px 1px 0 rgba(0,0,0,0.03); }
/* Timestamp inside bubble, right aligned */
.bubble .ts { display:inline-block; font-size:11px; color:#666; margin-left:8px; vertical-align:middle; float:right; }
.malisafi-widget-messages{ background:#e5ddd5; padding:12px; padding-bottom:84px; }

/* Ensure messages area is a scrolling column and reserves space for sticky input */
#malisafi-public-widget .malisafi-widget-messages{
	flex:1;
	min-height:160px;
	max-height:60vh;
	overflow-y:auto;
	display:flex;
	flex-direction:column;
	gap:8px;
	padding:12px;
	padding-bottom:120px; /* space for sticky input */
	box-sizing:border-box;
}
.bubble .bubble-body { font-size:14px; line-height:1.3; }
.bubble .ts { display:block; font-size:11px; color:#888; margin-top:6px; }
.malisafi-chat-ended { padding:12px; text-align:center; color:#666; }
.malisafi-chat-actions { padding:10px; text-align:center; }

/* Keep the input/form visible at the bottom of the panel */
.malisafi-widget-form{ position:sticky; bottom:0; background:#fff; padding:10px; z-index:6; box-shadow: 0 -6px 16px rgba(0,0,0,0.06); }
.malisafi-widget-form .malisafi-input-row{ margin:0 }
