/*
Project: HushMe.app
Company: Matrix Family Inc.
Maintainer: Matrix Family Inc.
Contact: dev@matrix.family
Support: support@matrix.family
Matrix: @support:matrix.family
Date: 2026-07-24
Status: Updated

One-time language offer only.
Uses the same radius / surface / button language as the rest of the UI.
*/

#hushme-lang-offer {
  position: fixed;
  left: 50%;
  bottom: 1.25rem;
  transform: translateX(-50%);
  z-index: 1000;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1rem;
  max-width: min(36rem, calc(100vw - 2rem));
  padding: 1rem 1.25rem;
  background-color: var(--color-bg-surface, #111);
  color: var(--color-text, #f5f5f5);
  border: 1px solid var(--color-border, rgba(255, 255, 255, 0.12));
  border-radius: var(--radius-lg, 16px);
}

#hushme-lang-offer p {
  margin: 0;
  flex: 1 1 12rem;
  font: 500 0.95rem/1.35 inherit;
  color: var(--color-text, #f5f5f5);
}

#hushme-lang-offer .hushme-lang-offer__actions {
  display: flex;
  gap: 0.5rem;
}

#hushme-lang-offer button {
  appearance: none;
  cursor: pointer;
  border-radius: var(--radius-md, 10px);
  font: 500 0.9375rem/1 inherit;
  padding: 0.75rem 1.25rem;
  transition: all 0.2s;
}

#hushme-lang-offer button[data-action="accept"] {
  background-color: var(--color-primary, #3d9970);
  color: #fff;
  border: none;
}

#hushme-lang-offer button[data-action="accept"]:hover {
  background-color: var(--color-primary-hover, #48b383);
}

#hushme-lang-offer button[data-action="decline"] {
  background-color: transparent;
  color: var(--color-text, #f5f5f5);
  border: 1px solid var(--color-border, rgba(255, 255, 255, 0.12));
}

#hushme-lang-offer button[data-action="decline"]:hover {
  border-color: var(--color-primary, #3d9970);
  color: var(--color-primary, #3d9970);
}
