/* UI polish v1 — focused refinement for Manage, Ingredients and Prepared Recipes.
   Visual-only: no pricing, auth, Supabase or calculation behavior changes. */

/* Keep the global topbar as the single Manage title. */
html body #view-manage .ux-manage-hero h2{
  display:none!important;
}
html body #view-manage .ux-manage-hero{
  margin:0 0 15px!important;
  padding:0 6px!important;
}
html body #view-manage .ux-manage-hero p{
  margin:0!important;
  font-size:.93rem!important;
  line-height:1.45!important;
  color:#748179!important;
}
html body #view-manage .ux-manage-list{
  gap:12px!important;
}
html body #view-manage .ux-manage-card{
  min-height:92px!important;
  padding:15px 17px!important;
  border-radius:22px!important;
}
html body #view-manage .ux-manage-icon{
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  border-radius:15px!important;
}
html body #view-manage .ux-manage-copy strong{
  font-size:1rem!important;
}
html body #view-manage .ux-manage-copy small{
  margin-top:3px!important;
  font-size:.78rem!important;
  line-height:1.35!important;
}

/* Leave enough scroll room above the fixed bottom navigation. */
html body #view-manage,
html body #view-ingredients,
html body #view-menu{
  padding-bottom:138px!important;
}

/* ===== INGREDIENT / PREPARED TAB STRIP ===== */
html body #view-ingredients .ingredient-tab-actions,
html body #view-ingredients .ita-tabs{
  padding:7px!important;
  gap:8px!important;
  border:1px solid #cbd9d1!important;
  border-radius:23px!important;
  background:linear-gradient(145deg,#e5eee9,#f8fbf9)!important;
  box-shadow:inset 0 3px 8px rgba(21,58,39,.10),0 10px 22px rgba(17,48,33,.10),inset 0 1px 0 #fff!important;
}
html body #view-ingredients .ingredient-tab-actions button,
html body #view-ingredients .ita-tabs button{
  min-height:48px!important;
  border:1px solid transparent!important;
  border-radius:17px!important;
  background:transparent!important;
  box-shadow:none!important;
  transition:transform .14s ease,box-shadow .14s ease,background .14s ease!important;
}
html body #view-ingredients .ingredient-tab-actions button.active,
html body #view-ingredients .ita-tabs button.active{
  transform:translateY(-1px)!important;
  border-color:#b9cae9!important;
  background:linear-gradient(145deg,#f9fbff,#dce5f7)!important;
  color:#3556b8!important;
  box-shadow:0 10px 18px rgba(53,86,184,.18),inset 0 1px 0 #fff,inset 0 -1px 0 rgba(53,86,184,.08)!important;
}
html body #view-ingredients .ingredient-tab-actions button[data-tab="prepared"].active,
html body #view-ingredients .ita-tabs button[data-tab="prepared"].active,
html body #view-ingredients .ingredient-tab-actions button[data-ingredient-tab="prepared"].active{
  border-color:#d2c8ee!important;
  background:linear-gradient(145deg,#fbf9ff,#e7e0f5)!important;
  color:#654fc2!important;
  box-shadow:0 10px 18px rgba(101,79,194,.18),inset 0 1px 0 #fff!important;
}
html body #view-ingredients .ingredient-tab-actions .small-btn,
html body #view-ingredients .ita-tabs .small-btn{
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  min-height:42px!important;
  border-radius:14px!important;
  border:1px solid #cddbd4!important;
  background:linear-gradient(145deg,#fff,#e9f0ec)!important;
  box-shadow:0 7px 14px rgba(17,48,33,.10),inset 0 1px 0 #fff!important;
}

/* ===== INGREDIENT FILTERS ===== */
html body #view-ingredients>.filters{
  gap:10px!important;
  margin:14px 0 14px!important;
}
html body #view-ingredients>.filters input,
html body #view-ingredients>.filters select{
  min-height:46px!important;
  border:1px solid #cfdcd5!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,#fff,#edf3f0)!important;
  box-shadow:0 8px 17px rgba(17,48,33,.09),inset 0 1px 0 #fff,inset 0 -1px 0 rgba(92,128,109,.08)!important;
}
html body #view-ingredients>.filters input:focus,
html body #view-ingredients>.filters select:focus{
  border-color:#8fb5a3!important;
  box-shadow:0 9px 18px rgba(17,48,33,.09),0 0 0 3px rgba(31,106,79,.09),inset 0 1px 0 #fff!important;
}
html body #view-ingredients .ingredient-sort-btn,
html body #view-ingredients .menu-sort-btn,
html body #view-ingredients .prv2-table-sort-btn{
  border:1px solid #cddbd4!important;
  border-radius:15px!important;
  background:linear-gradient(145deg,#fff,#e7efeb)!important;
  box-shadow:0 8px 17px rgba(17,48,33,.10),inset 0 1px 0 #fff!important;
}

/* ===== INGREDIENT TABLE — turn the flat rows into individual raised cards ===== */
html body #ingredientList.ib-table-list{
  padding:0 0 7px!important;
  border:1px solid #cbd9d1!important;
  border-radius:23px!important;
  background:linear-gradient(155deg,#eaf2ee,#f8fbf9)!important;
  box-shadow:0 20px 42px rgba(17,48,33,.14),inset 0 1px 0 #fff!important;
  overflow:hidden!important;
}
html body #ingredientList .ib-table-count{
  padding:12px 14px 9px!important;
  background:linear-gradient(180deg,#eef5f1,#f9fbfa)!important;
  border-bottom:1px solid #d6e1db!important;
}
html body #ingredientList .ib-table-head{
  margin:0 9px 2px!important;
  padding:8px 9px!important;
  border:0!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.55)!important;
}
html body #ingredientList .ib-table-row{
  width:calc(100% - 16px)!important;
  margin:7px 8px!important;
  border:1px solid #d5e1da!important;
  border-radius:15px!important;
  background:linear-gradient(145deg,#fff,#f0f5f2)!important;
  box-shadow:0 7px 15px rgba(17,48,33,.08),inset 0 1px 0 #fff!important;
  overflow:hidden!important;
}
html body #ingredientList .ib-table-row:last-child{
  border-bottom:1px solid #d5e1da!important;
}
html body #ingredientList .ib-table-row:active{
  transform:translateY(1px)!important;
  background:linear-gradient(145deg,#eef5f1,#fff)!important;
  box-shadow:inset 0 3px 7px rgba(17,48,33,.10),inset 0 1px 0 #fff!important;
}
html body #ingredientList .ib-table-row .ib-table-main{
  min-height:53px!important;
}

/* ===== PREPARED RECIPE CATEGORY FILTERS ===== */
html body #view-ingredients .prv2-category-grid{
  gap:9px!important;
  margin:10px 0 15px!important;
}
html body #view-ingredients .prv2-category-grid button{
  min-height:45px!important;
  border:1px solid #d3dfd9!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,#fff,#edf3f0)!important;
  color:#64716a!important;
  box-shadow:0 7px 15px rgba(17,48,33,.08),inset 0 1px 0 #fff!important;
}
html body #view-ingredients .prv2-category-grid button.active{
  transform:translateY(-1px)!important;
  border-color:#c8bce9!important;
  background:linear-gradient(145deg,#f8f5ff,#e2daf4)!important;
  color:#654fc2!important;
  box-shadow:0 10px 19px rgba(101,79,194,.18),inset 0 1px 0 #fff!important;
}
html body #view-ingredients #prv2TableTools{
  gap:10px!important;
  margin-bottom:14px!important;
}
html body #view-ingredients #prv2TableSearch{
  min-height:46px!important;
  border:1px solid #d0d9df!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,#fff,#f2f0f7)!important;
  box-shadow:0 8px 17px rgba(55,43,102,.09),inset 0 1px 0 #fff!important;
}
html body #view-ingredients .prv2-table-sort-btn{
  min-height:46px!important;
  height:46px!important;
  border-color:#d3cae8!important;
  background:linear-gradient(145deg,#fff,#eee9f7)!important;
  color:#654fc2!important;
  box-shadow:0 8px 17px rgba(75,55,145,.11),inset 0 1px 0 #fff!important;
}

/* ===== PREPARED RECIPE TABLE — raised rows, not a flat spreadsheet ===== */
html body #batchRecipeList.prv2-table-list{
  padding:0 0 7px!important;
  border:1px solid #d2cae5!important;
  border-radius:23px!important;
  background:linear-gradient(155deg,#eeeaf6,#faf9fc)!important;
  box-shadow:0 20px 42px rgba(55,43,102,.13),inset 0 1px 0 #fff!important;
  overflow:hidden!important;
}
html body #batchRecipeList .prv2-table-count{
  padding:12px 14px 9px!important;
  background:linear-gradient(180deg,#f1eef8,#fbfafc)!important;
  border-bottom:1px solid #ded8eb!important;
}
html body #batchRecipeList .prv2-table-head{
  margin:0 9px 2px!important;
  padding:8px 9px!important;
  border:0!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.58)!important;
}
html body #batchRecipeList .prv2-table-row{
  width:calc(100% - 16px)!important;
  margin:7px 8px!important;
  border:1px solid #ddd7e9!important;
  border-radius:15px!important;
  background:linear-gradient(145deg,#fff,#f4f1f8)!important;
  box-shadow:0 7px 15px rgba(55,43,102,.075),inset 0 1px 0 #fff!important;
  overflow:hidden!important;
}
html body #batchRecipeList .prv2-table-row:last-child{
  border-bottom:1px solid #ddd7e9!important;
}
html body #batchRecipeList .prv2-table-row:active{
  transform:translateY(1px)!important;
  background:linear-gradient(145deg,#eeeaf6,#fff)!important;
  box-shadow:inset 0 3px 7px rgba(55,43,102,.10),inset 0 1px 0 #fff!important;
}
html body #batchRecipeList .prv2-table-main{
  min-height:55px!important;
}

@media(max-width:520px){
  html body #view-manage .ux-manage-card{min-height:88px!important;padding:14px!important}
  html body #view-manage .ux-manage-icon{width:46px!important;height:46px!important;min-width:46px!important}
  html body #view-ingredients .ingredient-tab-actions,
  html body #view-ingredients .ita-tabs{padding:6px!important;gap:6px!important}
  html body #view-ingredients .ingredient-tab-actions button,
  html body #view-ingredients .ita-tabs button{min-height:45px!important}
  html body #ingredientList .ib-table-row,
  html body #batchRecipeList .prv2-table-row{margin:6px 7px!important;width:calc(100% - 14px)!important}
}

@media(prefers-reduced-motion:reduce){
  html body #view-ingredients button,
  html body #view-manage button{transition:none!important}
}