@import "tailwindcss";

@font-face {
  font-family: 'KhmerOS';
  src: url('/src/lib/fonts/KhmerOS_battambang.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

html,
body,
#root {
  font-family: 'KhmerOS', system-ui, Arial, sans-serif;
}

.input {
  height: 48px;
  width: 100%;
  border-radius: 16px;
  border: 1px solid rgb(203 213 225);
  padding: 0 16px;
  font-size: 14px;
  outline: none;
  background: white;
}

.input:focus {
  border-color: rgb(15 23 42);
}

.input-pro {
  height: 48px;
  width: 100%;
  border-radius: 18px;
  border: 1px solid #dbe3ef;
  background: #f8fafc;
  padding: 0 16px;
  font-size: 14px;
  outline: none;
  transition: 0.2s;
}

.input-pro:focus {
  border-color: #f97316;
  background: white;
  box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.12);
}

.btn-card {
  height: 42px;
  border-radius: 16px;
  font-size: 13px;
  font-weight: 900;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}