/* Jikoni Core Frontend Styles */

/* Basic recipe meta styling */
.jikoni-recipe-meta {
  margin-bottom: 2rem;
  padding: 1rem;
  background: #F4F6F8; /* Porcelain */
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
}
.jikoni-recipe-meta h3 {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  color: #2E7D32; /* Plantain Green */
  font-family: 'Manrope', sans-serif;
}
.jikoni-recipe-meta ul,
.jikoni-recipe-meta ol {
  margin-left: 1.2rem;
}
.jikoni-recipe-meta li {
  line-height: 1.4;
  margin-bottom: 0.3rem;
}

/* Rating stars */
.jikoni-rating {
  margin-top: 1rem;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 1.2rem;
}
.jikoni-rating .jikoni-star {
  cursor: pointer;
  color: #E4572E; /* Spice Orange */
  transition: transform 0.2s ease;
}
.jikoni-rating .jikoni-star:hover,
.jikoni-rating .jikoni-star:hover ~ .jikoni-star {
  transform: scale(1.2);
}
.jikoni-rating .rated {
  color: #2E7D32; /* Plantain Green */
}
.jikoni-rating-average {
  font-weight: bold;
  margin-left: 0.5rem;
  color: #253659; /* Indigo Night */
}
.jikoni-rating-count {
  margin-left: 0.3rem;
  font-size: 0.85rem;
  color: #555;
}

/* Recipe submission form */
.jikoni-recipe-form {
  background: #F4F6F8;
  padding: 1.5rem;
  border-radius: 8px;
  margin-bottom: 2rem;
}
.jikoni-recipe-form label {
  font-weight: bold;
  color: #253659;
}
.jikoni-recipe-form input[type="text"],
.jikoni-recipe-form textarea,
.jikoni-recipe-form select {
  width: 100%;
  padding: 0.5rem;
  margin-top: 0.2rem;
  margin-bottom: 0.8rem;
  border: 1px solid #CCC;
  border-radius: 4px;
  font-family: inherit;
}
.jikoni-recipe-form button.button-primary {
  background-color: #2E7D32;
  border-color: #2E7D32;
  color: #fff;
  padding: 0.6rem 1.2rem;
  border-radius: 4px;
  transition: background-color 0.2s ease;
}
.jikoni-recipe-form button.button-primary:hover {
  background-color: #245d28;
  border-color: #245d28;
}

/* Login, register and profile forms */
.jikoni-login-form form,
.jikoni-register-form,
.jikoni-profile-form,
.jikoni-settings-form {
  background: #F4F6F8;
  padding: 1.5rem;
  border-radius: 8px;
  margin-bottom: 2rem;
  max-width: 600px;
}
.jikoni-login-form label,
.jikoni-register-form label,
.jikoni-profile-form label,
.jikoni-settings-form label {
  font-weight: bold;
  color: #253659;
}
.jikoni-login-form input[type="text"],
.jikoni-login-form input[type="password"],
.jikoni-login-form input[type="email"],
.jikoni-register-form input[type="text"],
.jikoni-register-form input[type="password"],
.jikoni-register-form input[type="email"],
.jikoni-profile-form input[type="text"],
.jikoni-profile-form input[type="password"],
.jikoni-profile-form input[type="email"],
.jikoni-profile-form select,
.jikoni-settings-form input[type="text"],
.jikoni-settings-form input[type="url"] {
  width: 100%;
  padding: 0.5rem;
  margin-top: 0.2rem;
  margin-bottom: 0.8rem;
  border: 1px solid #CCC;
  border-radius: 4px;
  font-family: inherit;
}
.jikoni-login-form button.button,
.jikoni-register-form button.button,
.jikoni-profile-form button.button,
.jikoni-settings-form button.button {
  background-color: #2E7D32;
  border-color: #2E7D32;
  color: #fff;
  padding: 0.6rem 1.2rem;
  border-radius: 4px;
  transition: background-color 0.2s ease;
}
.jikoni-login-form button.button:hover,
.jikoni-register-form button.button:hover,
.jikoni-profile-form button.button:hover,
.jikoni-settings-form button.button:hover {
  background-color: #245d28;
  border-color: #245d28;
}

/* Community feed */
.jikoni-community-feed {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 1.5rem;
}
.jikoni-community-item {
  background: #F4F6F8;
  padding: 1rem;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}
.jikoni-community-item .jikoni-item-title {
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
  color: #2E7D32;
  font-family: 'Manrope', sans-serif;
}
.jikoni-community-item .jikoni-item-title a {
  text-decoration: none;
  color: inherit;
}
.jikoni-community-item .jikoni-item-meta {
  font-size: 0.85rem;
  color: #555;
  margin-bottom: 0.5rem;
}
.jikoni-community-item .jikoni-item-excerpt {
  font-size: 0.9rem;
  color: #333;
}