@import '_content/Blazor.Bootstrap/Blazor.Bootstrap.bundle.scp.css';

/* /Shared/Components/IngredientItem.razor.rz.scp.css */
.ingredient-item[b-7lkuhyeged] {
    background-color: #f9f9f9; /* Light background for contrast */
    border: 1px solid #ddd; /* Subtle border */
}
/* /Shared/Components/InstructionItem.razor.rz.scp.css */
body[b-priccntue0] {
}
/* /Shared/Components/RecipeImageCard.razor.rz.scp.css */
.card-img-top-container[b-3pmipgmxyo] {
    position: relative;
    width: 100%;
    padding-top: 75%; /* Adjust this value to control the aspect ratio (4:3 in this case) */
    overflow: hidden;
    background-color: #f9f9f9; /* Optional: Fallback background for transparency */
    border-radius: 8px; /* Optional: Rounded corners */
}

.card-img-top[b-3pmipgmxyo] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Options: cover, contain, fill, scale-down */
    object-position: center;
    border-radius: 8px; /* Match the container's border radius */
}
/* /Shared/Components/RecipeTile.razor.rz.scp.css */
.card[b-78db1vbj69]{width:18rem;margin-left:auto;margin-right:auto;}.card .card-img-top[b-78db1vbj69]{width:100%;height:15vh;object-fit:cover;}
/* /Shared/Syncing.razor.rz.scp.css */
.splash.syncing[b-0ucdgjtpmf] {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background: linear-gradient(135deg, #ff7e5f, #feb47b);
  color: #fff;
  text-align: center;
  font-family: "Arial", sans-serif;
}
.splash.syncing .splash-content[b-0ucdgjtpmf] {
  max-width: 400px;
}
.splash.syncing .splash-content .sync-animation[b-0ucdgjtpmf] {
  position: relative;
  margin: 0 auto 20px auto;
  width: 60px;
  height: 60px;
}
.splash.syncing .splash-content .sync-animation .sync-circle[b-0ucdgjtpmf] {
  position: absolute;
  width: 60px;
  height: 60px;
  border: 5px solid rgba(255, 255, 255, 0.3);
  border-top: 5px solid #fff;
  border-radius: 50%;
  animation: sync-spin-b-0ucdgjtpmf 1.5s linear infinite;
}
.splash.syncing .splash-content .sync-animation .sync-line[b-0ucdgjtpmf] {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 40px;
  height: 5px;
  background: #fff;
  transform-origin: 0 50%;
  transform: translate(-50%, -50%) rotate(0deg);
  animation: sync-line-rotate-b-0ucdgjtpmf 1.5s linear infinite;
}
.splash.syncing .splash-content .splash-title[b-0ucdgjtpmf] {
  font-size: 1.8rem;
  margin: 10px 0;
}
.splash.syncing .splash-content .splash-message[b-0ucdgjtpmf] {
  font-size: 1rem;
  opacity: 0.85;
}

@keyframes sync-spin-b-0ucdgjtpmf {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes sync-line-rotate-b-0ucdgjtpmf {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
/* /Shared/SyncInitializing.razor.rz.scp.css */
.splash.initializing .splash-content[b-e99w7hblc8] {
  max-width: 400px;
}
.splash.initializing .splash-content .splash-logo[b-e99w7hblc8] {
  width: 100px;
  margin-bottom: 20px;
  border-radius: 50%;
}
.splash.initializing .splash-content .splash-title[b-e99w7hblc8] {
  font-size: 1.8rem;
  margin: 10px 0;
}
.splash.initializing .splash-content .splash-message[b-e99w7hblc8] {
  font-size: 1rem;
  margin-bottom: 20px;
  opacity: 0.85;
}

.spinner[b-e99w7hblc8] {
  width: 50px;
  height: 50px;
  border: 5px solid rgba(255, 255, 255, 0.3);
  border-top: 5px solid #fff;
  border-radius: 50%;
  animation: spin-b-e99w7hblc8 1s linear infinite;
}

@keyframes spin-b-e99w7hblc8 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
