@import "tailwindcss";

@theme {
  --color-brand: #00a884;
  --color-brand-glow: rgba(0, 168, 132, 0.4);
  --font-sans: 'Inter', system-ui, sans-serif;
}

:root {
  /* LIGHT MODE (WhatsApp Web Light) */
  --background: #f0f2f5;
  --foreground: #111b21;
  --header-bg: #f0f2f5;
  --sidebar-bg: #ffffff;
  --chat-list-bg: #ffffff;
  --chat-active: #f0f2f5;
  --chat-hover: #f5f6f6;
  --chat-window-bg: #efeae2;
  --bubble-me: #d9fdd3;
  --bubble-other: #ffffff;
  --bubble-text: #111b21;
  --input-bg: #ffffff;
  --panel-bg: #ffffff;
  --panel-border: #e9edef;
  --glass-bg: rgba(255, 255, 255, 0.85);
  --glass-border: rgba(0, 0, 0, 0.08);
  --wa-bg-opacity: 0.06;
}

[data-theme="dark"] {
  /* DARK MODE (WhatsApp Web Dark) */
  --background: #0b141a;
  --foreground: #e9edef;
  --header-bg: #202c33;
  --sidebar-bg: #111b21;
  --chat-list-bg: #111b21;
  --chat-active: #2a3942;
  --chat-hover: #202c33;
  --chat-window-bg: #0b141a;
  --bubble-me: #005c4b;
  --bubble-other: #202c33;
  --bubble-text: #e9edef;
  --input-bg: #2a3942;
  --panel-bg: #202c33;
  --panel-border: #222d34;
  --glass-bg: rgba(32, 44, 51, 0.85);
  --glass-border: rgba(255, 255, 255, 0.08);
  --wa-bg-opacity: 0.06;
}

/* HarmonyOS, Samsung, Safari & Global Browser Parity Optimization */
html, body {
  height: 100%;
  min-height: -webkit-fill-available;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth;
  text-rendering: optimizeLegibility;
}

body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  margin: 0;
  padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom) 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  touch-action: manipulation;
  overscroll-behavior-y: none;
}

/* Touch-Optimized Interactions */
button, a, input, select, textarea {
  cursor: pointer;
  touch-action: manipulation;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* Custom Scrollbar for Premium Feel - Cross Browser */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(134, 150, 160, 0.2); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: rgba(134, 150, 160, 0.3); }

/* Firefox Scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(134, 150, 160, 0.2) transparent;
}

/* Android/Huawei/Samsung Input Reset */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--foreground) !important;
  -webkit-box-shadow: 0 0 0px 1000px var(--background) inset !important;
  transition: background-color 5000s ease-in-out 0s;
}

/* Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-in {
  animation: fadeIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}