/* Simple Search Block Styles */
.simple-search-block {
  position: relative;
}

.simple-search-form {
  margin: 0;
}

.simple-search-wrapper {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin: 0;
  padding: 0;
}

.simple-search-wrapper .form-item {
  flex: 1;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: stretch;
}

.simple-search-wrapper .form-item .form-element-label {
  display: none;
}

/* 强制对齐 - 重置所有可能影响对齐的样式 */
.simple-search-wrapper * {
  vertical-align: top;
}

.simple-search-wrapper .form-item,
.simple-search-wrapper .form-item > div {
  margin: 0 !important;
  padding: 0 !important;
}

.simple-search-input {
  width: 100%;
  height: 44px;
  margin: 0;
  padding: 10px 15px;
  border: 2px solid #e1e5e9;
  border-radius: 20px 0 0 20px;
  border-right: none;
  font-size: 14px;
  background: #f8f9fa;
  transition: all 0.3s ease;
  outline: none;
  box-sizing: border-box;
  vertical-align: top;
}

.simple-search-input:focus {
  border-color: #2ba854;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(43, 168, 84, 0.1);
}

.form-text.simple-search-input {
  margin-top: 0;
  margin-bottom: 0;
}

.simple-search-input::placeholder {
  color: #6c757d;
  font-style: italic;
}

/* 搜索图标样式 - 作为flex项目 */
.simple-search-wrapper > i {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  margin: 0;
  background: #2ba854;
  border: 2px solid #2ba854;
  border-radius: 0 20px 20px 0;
  border-left: none;
  color: #fff;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  box-sizing: border-box;
  vertical-align: top;
}

.simple-search-wrapper > i:hover {
  background: #228b22;
  border-color: #228b22;
  transform: scale(1.05);
}

/* 表单聚焦状态 */
.simple-search-form.focused .simple-search-input {
  border-color: #2ba854;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(43, 168, 84, 0.1);
}

.simple-search-form.focused .simple-search-wrapper > i {
  background: #228b22;
  border-color: #228b22;
}

.simple-search-input:focus + .form-item + i,
.simple-search-wrapper:focus-within > i {
  background: #228b22;
  border-color: #228b22;
  box-shadow: 0 0 0 3px rgba(43, 168, 84, 0.1);
}

/* Responsive styles */
@media (max-width: 767.98px) {
  .simple-search-input {
    height: 35px;
    padding: 6px 12px;
    font-size: 13px;
  }

  .simple-search-wrapper > i {
    width: 35px;
    height: 35px;
    font-size: 12px;
  }
}