body {
  font-family: 'Cairo', sans-serif;
  background-color: #f9fcff;
  color: #004d73;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
header {
  background-color: #e3f5ff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 20px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.logo { display: flex; align-items: center; }
.logo img { width: 50px; margin-left: 10px; }
nav ul { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; }
nav a { text-decoration: none; color: #0078b7; font-weight: bold; }
.lang-switch button {
  border: none; background: #fff; padding: 5px 10px; margin: 0 2px; cursor: pointer; border-radius: 5px;
}
.lang-switch .active { background-color: #00aaff; color: white; }
.chatbox {
  flex: 1; max-width: 600px; margin: 40px auto; background: #fff; border-radius: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1); display: flex; flex-direction: column; overflow: hidden;
}
#chat-window { flex: 1; padding: 15px; overflow-y: auto; }
.msg { background: #e3f5ff; margin: 5px 0; padding: 10px; border-radius: 10px; width: fit-content; }
.msg.user { background: #c1ecff; align-self: flex-end; }
.input-area { display: flex; border-top: 1px solid #ddd; }
.input-area input { flex: 1; border: none; padding: 10px; font-size: 16px; outline: none; }
.input-area button {
  background: #00aaff; color: white; border: none; padding: 10px 20px; cursor: pointer; font-size: 18px;
}
.whatsapp-btn {
  display: block; text-align: center; background: #25d366; color: white;
  text-decoration: none; padding: 15px; border-radius: 5px; margin: 20px;
}