/**
 * WhatsApp-inspired shell theme (tokens from WHATSAPP_DESIGN.md).
 * Loaded after layui.css to restyle shared components without changing markup.
 */
:root {
  --wa-teal: #128c7e;
  --wa-teal-deep: #075e54;
  --wa-green: #25d366;
  --wa-teal-bright: #1cb39b;
  --wa-text: #1c1e21;
  --wa-text-dark: #111b21;
  --wa-muted: #5e5e5e;
  --wa-page: #f0f4f9;
  --wa-cream: #fcf5eb;
  --wa-mint: #e6ffda;
  --wa-white: #ffffff;
  --wa-hairline: #d1d7db;
  --wa-panel: #f0f2f5;
  --wa-sidebar: #202c33;
  --wa-sidebar-deep: #111b21;
  --wa-link-hover: #43cd66;
  --wa-danger: #ea0038;
}

html {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

body {
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  color: var(--wa-text);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* -------- Layui: primary actions (green, pill-friendly) -------- */
.layui-btn {
  border-radius: 50px;
  transition: background-color 0.2s linear, border-color 0.2s linear, color 0.2s linear;
}

.layui-btn-normal {
  background-color: var(--wa-green) !important;
  border-color: var(--wa-green) !important;
  color: var(--wa-text-dark) !important;
}

.layui-btn-normal:hover {
  filter: brightness(0.95);
}

.layui-btn-primary {
  background-color: var(--wa-teal) !important;
  border-color: var(--wa-teal-deep) !important;
  color: #fff !important;
}

.layui-btn-primary:hover {
  background-color: var(--wa-teal-deep) !important;
  border-color: var(--wa-teal-deep) !important;
}

.layui-btn-warm {
  background-color: var(--wa-teal) !important;
  border-color: var(--wa-teal) !important;
  color: #fff !important;
}

.layui-btn-danger {
  border-radius: 50px;
}

.layui-border-blue,
.layui-btn-blue {
  background-color: var(--wa-teal) !important;
  border-color: var(--wa-teal-bright) !important;
  color: #fff !important;
}

.layui-btn-xs,
.layui-btn-sm {
  border-radius: 40px;
}

/* Form */
.layui-form-onswitch {
  border-color: var(--wa-teal) !important;
  background-color: var(--wa-teal-deep) !important;
}

.layui-form-radio > i:hover,
.layui-form-radioed > i {
  color: var(--wa-teal) !important;
}

.layui-form-select dl dd.layui-this {
  background-color: var(--wa-teal) !important;
}

.layui-input:focus,
.layui-textarea:focus {
  border-color: var(--wa-teal-bright) !important;
}

/* Tabs */
.layui-tab-brief > .layui-tab-title .layui-this {
  color: var(--wa-teal-deep) !important;
}

.layui-tab-brief > .layui-tab-more li.layui-this:after,
.layui-tab-brief > .layui-tab-title .layui-this:after {
  border-bottom: 2px solid var(--wa-green) !important;
}

/* Table chrome */
.layui-table thead tr {
  background-color: var(--wa-mint) !important;
}

.layui-table-hover tbody tr:hover {
  background-color: rgba(230, 255, 218, 0.45) !important;
}

/* Layer */
.layui-layer-btn .layui-layer-btn0 {
  border-color: var(--wa-green) !important;
  background-color: var(--wa-green) !important;
  color: var(--wa-text-dark) !important;
  border-radius: 50px;
}

.layui-layer-title {
  background-color: var(--wa-teal-deep) !important;
  color: #fff !important;
}

/* Badge */
.layui-badge,
.layui-badge-rim {
  border-radius: 12px;
}

/* -------- Admin iframe pages (.main) -------- */
body .main {
  background-color: var(--wa-white);
  border: 1px solid rgba(17, 27, 33, 0.08);
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(17, 27, 33, 0.06);
}

/* Scrollbars (webkit) */
::-webkit-scrollbar-thumb {
  background: rgba(7, 94, 84, 0.25);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(7, 94, 84, 0.4);
}

/* ----- Layer iframe: translation settings (set_lang) ----- */
.layui-layer-content iframe {
  border-radius: 2px;
}

body .kf-set-lang-page .layui-form-label {
  color: var(--wa-text-dark);
  font-size: 15px;
  line-height: 1.45;
}

body .kf-set-lang-page .kf-set-lang-footer {
  border-top-color: var(--wa-hairline) !important;
}
