/* ===== Telegram Request Form - Vitrayadak Style ===== */

.telegram-form {
  max-width: 100%;
  margin: 0 auto;
  padding: 0;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* wrapper field spacing */
.telegram-form .telegram-field,
.telegram-form p,
.telegram-form .form-group,
.telegram-form > div {
  margin-bottom: 14px;
}

/* Inputs */
.telegram-form .telegram-input,
.telegram-form input[type="text"],
.telegram-form input[type="tel"],
.telegram-form input[type="email"],
.telegram-form input[type="number"],
.telegram-form textarea,
.telegram-form select {
  width: 100% !important;
  padding: 14px 16px !important;
  margin-bottom: 0 !important;
  font-size: 15px !important;
  line-height: 1.8;
  border-radius: 16px !important;
  border: 1px solid rgba(242, 103, 44, 0.14) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: #111111 !important;
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.05) !important;
  transition: all 0.25s ease !important;
  outline: none !important;
  font-family: inherit !important;
}

/* Focus */
.telegram-form .telegram-input:focus,
.telegram-form input[type="text"]:focus,
.telegram-form input[type="tel"]:focus,
.telegram-form input[type="email"]:focus,
.telegram-form input[type="number"]:focus,
.telegram-form textarea:focus,
.telegram-form select:focus {
  background: #ffffff !important;
  border-color: #f2672c !important;
  box-shadow: 0 0 0 4px rgba(242, 103, 44, 0.12) !important;
  color: #111111 !important;
}

/* Placeholder */
.telegram-form .telegram-input::placeholder,
.telegram-form input::placeholder,
.telegram-form textarea::placeholder {
  color: #8b8b8b !important;
  opacity: 1;
}

/* Labels */
.telegram-form label {
  display: block;
  margin-bottom: 7px;
  font-size: 0.92rem;
  font-weight: 700;
  color: #333333 !important;
}

/* Button */
.telegram-form .telegram-button,
.telegram-form button,
.telegram-form input[type="submit"] {
  width: 100% !important;
  padding: 15px 18px !important;
  border-radius: 999px !important;
  border: none !important;
  background: linear-gradient(135deg, #f2672c, #ef4444) !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.4;
  cursor: pointer;
  box-shadow: 0 14px 30px rgba(242, 103, 44, 0.24) !important;
  transition: all 0.3s ease !important;
  appearance: none;
  -webkit-appearance: none;
}

/* Hover */
.telegram-form .telegram-button:hover,
.telegram-form button:hover,
.telegram-form input[type="submit"]:hover {
  background: linear-gradient(135deg, #e85d22, #dc2626) !important;
  color: #ffffff !important;
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(242, 103, 44, 0.3) !important;
}

/* Focus */
.telegram-form .telegram-button:focus,
.telegram-form button:focus,
.telegram-form input[type="submit"]:focus {
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(242, 103, 44, 0.16) !important;
}

/* Active */
.telegram-form .telegram-button:active,
.telegram-form button:active,
.telegram-form input[type="submit"]:active {
  transform: scale(0.985);
  box-shadow: 0 10px 20px rgba(242, 103, 44, 0.22) !important;
}

/* Disabled */
.telegram-form .telegram-button:disabled,
.telegram-form button:disabled,
.telegram-form input[type="submit"]:disabled {
  background: #f3b39a !important;
  color: #ffffff !important;
  cursor: not-allowed;
  box-shadow: none !important;
  transform: none !important;
}

/* Messages */
.aseman-msg {
  margin-top: 14px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.8;
  padding: 12px 14px;
  border-radius: 14px;
}

.aseman-msg--success {
  color: #166534 !important;
  background: #ecfdf3 !important;
  border: 1px solid #bbf7d0 !important;
}

.aseman-msg--error {
  color: #b91c1c !important;
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
}

/* textarea */
.telegram-form textarea {
  min-height: 120px;
  resize: vertical;
}

/* mobile */
@media (max-width: 767px) {
  .telegram-form .telegram-input,
  .telegram-form input[type="text"],
  .telegram-form input[type="tel"],
  .telegram-form input[type="email"],
  .telegram-form input[type="number"],
  .telegram-form textarea,
  .telegram-form select {
    padding: 13px 14px !important;
    font-size: 14px !important;
    border-radius: 14px !important;
  }

  .telegram-form .telegram-button,
  .telegram-form button,
  .telegram-form input[type="submit"] {
    padding: 14px 16px !important;
    font-size: 14px !important;
  }
}
/* فاصله استاندارد بین فیلدها */
.telegram-form form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* اگر ساختار div داره */
.telegram-form form > div,
.telegram-form .telegram-field,
.telegram-form p {
  margin: 0 !important;
}

/* فاصله بین label و input */
.telegram-form label {
  margin-bottom: 6px !important;
}

/* فاصله پایین هر input (fallback) */
.telegram-form .telegram-input,
.telegram-form input,
.telegram-form textarea,
.telegram-form select {
  margin-bottom: 0 !important;
}

/* اگر فیلدها inline شدن (بعضی افزونه‌ها) */
.telegram-form .form-row {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* حالت خاص: اگر دو فیلد کنار هم بودند */
.telegram-form .form-row.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

/* موبایل */
@media (max-width: 767px) {
  .telegram-form form {
    gap: 14px;
  }

  .telegram-form .form-row.two-col {
    grid-template-columns: 1fr;
  }
}
/* فاصله واقعی بین فیلدها */
.telegram-form form > * {
  margin-bottom: 16px !important;
}

/* آخرین آیتم فاصله نداشته باشه */
.telegram-form form > *:last-child {
  margin-bottom: 0 !important;
}

/* اگر داخل div یا p هست */
.telegram-form form > div,
.telegram-form form > p {
  margin-bottom: 16px !important;
}

/* فاصله بین input ها اگر مستقیم هستن */
.telegram-form input + input,
.telegram-form textarea + textarea,
.telegram-form select + select {
  margin-top: 16px !important;
}

/* فاصله دکمه */
.telegram-form .telegram-button,
.telegram-form input[type="submit"] {
  margin-top: 10px !important;
}