/* CREATE A RECIPE modal — warm, calm, mobile first. Uses the existing modal
   shell (.rh-view-sheet), so scrolling, the X and the save contract are
   unchanged; this only styles the form inside. */
.rh-view-sheet .rcx{ font-family:'Nunito',system-ui,sans-serif; }
.rcx-lead{ margin:0 0 18px; font-size:.95rem; line-height:1.6;
  color:#6E7683 !important; -webkit-text-fill-color:#6E7683 !important; }

.rcx-seg{ display:flex; gap:8px; margin:0 0 16px; flex-wrap:wrap; }
.rcx-segb{ flex:1 1 0; min-width:96px; min-height:46px; padding:11px 12px;
  border-radius:999px; cursor:pointer; font:inherit; font-size:.86rem; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  background:#FFFFFF !important; border:1px solid #E7E1D6 !important;
  color:#3F4753 !important; -webkit-text-fill-color:#3F4753 !important; }
.rcx-segb.is-on{ background:#EDF3E9 !important; border-color:#CADBC3 !important;
  color:#2E4A2C !important; -webkit-text-fill-color:#2E4A2C !important; }
.rcx-segb:focus-visible, .rcx-tag:focus-visible, .rcx-add:focus-visible,
.rcx-photo:focus-visible, .rcx-fav:focus-visible{ outline:3px solid #CF9E3F; outline-offset:2px; }
.rcx-modenote{ margin:0 0 16px; padding:13px 15px; border-radius:14px; font-size:.86rem;
  line-height:1.6; background:#FBF3E3 !important;
  color:#6B5427 !important; -webkit-text-fill-color:#6B5427 !important; }

.rcx-photo{ display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  cursor:pointer; font:inherit; padding:14px 16px; margin:0 0 18px;
  border-radius:16px; border:1px dashed #DED6C7 !important; background:#FBFAF7 !important; }
.rcx-photo:hover{ border-color:#B9CDB2 !important; }
.rcx-photo-ic{ flex:none; width:40px; height:40px; border-radius:12px;
  display:flex; align-items:center; justify-content:center; font-size:1.1rem;
  background:#EDF3E9; color:#5F7D59; }
.rcx-photo-t b{ display:block; font-size:.94rem; color:#243447; }
.rcx-photo-t em{ display:block; font-style:normal; font-size:.8rem; color:#9AA2AD; }

.rcx-f{ display:block; margin:0 0 14px; }
.rcx-l{ display:block; margin:0 0 6px; font-size:.78rem; font-weight:800;
  letter-spacing:.04em;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
.rcx-i{ box-sizing:border-box; width:100%; min-height:50px; padding:13px 16px;
  border-radius:14px; font:inherit; font-size:.97rem;
  background:#FFFFFF !important; border:1px solid #E7E1D6 !important;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.rcx-i::placeholder{ color:#A9AFB8; }
.rcx-i:focus{ outline:none; border-color:#9FBE97 !important;
  box-shadow:0 0 0 3px rgba(125,158,119,.20); }
.rcx-ta{ min-height:132px; resize:vertical; line-height:1.65; }
.rcx-ta.is-mid{ min-height:90px; }
.rcx-row3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:0 0 6px; }
.rcx-row3 .rcx-f{ margin:0; }

.rcx-sec{ margin:24px 0 0; padding:20px 0 0; border-top:1px solid #F0EBE1; }
.rcx-h{ display:flex; align-items:center; gap:8px; margin:0 0 4px !important;
  font-family:'Playfair Display',Georgia,serif !important;
  font-size:1.12rem !important; font-weight:700 !important;
  color:#243447 !important; -webkit-text-fill-color:#243447 !important; }
.rcx-help{ margin:0 0 10px; font-size:.83rem;
  color:#8A919B !important; -webkit-text-fill-color:#8A919B !important; }
.rcx-add{ margin:10px 0 0; min-height:44px; padding:10px 16px; border-radius:999px;
  cursor:pointer; font:inherit; font-size:.85rem; font-weight:800;
  background:#FFFFFF !important; border:1px solid #E7E1D6 !important;
  color:#3F6B3A !important; -webkit-text-fill-color:#3F6B3A !important; }
.rcx-add:hover{ border-color:#9FBE97 !important; }

.rcx-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.rcx-tag{ min-height:44px; padding:10px 15px; border-radius:999px; cursor:pointer;
  font:inherit; font-size:.84rem; font-weight:700;
  background:#FFFFFF !important; border:1px solid #E7E1D6 !important;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
.rcx-tag.is-on{ background:#EDF3E9 !important; border-color:#CADBC3 !important;
  color:#2E4A2C !important; -webkit-text-fill-color:#2E4A2C !important; }
.rcx-fav{ margin:14px 0 0; min-height:46px; padding:11px 18px; border-radius:999px;
  cursor:pointer; font:inherit; font-size:.86rem; font-weight:800;
  display:inline-flex; align-items:center; gap:8px;
  background:#FFFFFF !important; border:1px solid #E7E1D6 !important;
  color:#5A6472 !important; -webkit-text-fill-color:#5A6472 !important; }
.rcx-fav[aria-pressed="true"]{ background:#FBEFEE !important; border-color:#E6C4C0 !important;
  color:#8C4C40 !important; -webkit-text-fill-color:#8C4C40 !important; }

/* the shell's own footer buttons, restyled to her hierarchy */
.rh-view-sheet .rh-view-body > div:last-child{
  display:flex !important; flex-direction:column-reverse !important; gap:6px !important;
  margin-top:26px !important; }
.rh-view-sheet .rhx-btn{ min-height:52px; border-radius:999px !important;
  font-weight:800 !important; }
.rh-view-sheet .rhx-btn.is-primary{
  width:100%; justify-content:center;
  background:#DCE8D6 !important; border:1px solid #C3D8BA !important;
  color:#26401F !important; -webkit-text-fill-color:#26401F !important;
  box-shadow:none !important; }
.rh-view-sheet .rhx-btn.is-primary:hover{ background:#D0E0C8 !important; }
.rh-view-sheet .rhx-btn:not(.is-primary){
  background:transparent !important; border:0 !important; min-height:44px;
  font-weight:700 !important; font-size:.88rem !important;
  color:#8A919B !important; -webkit-text-fill-color:#8A919B !important; }
@media (max-width:520px){
  .rcx-row3{ grid-template-columns:1fr 1fr; }
  .rcx-row3 .rcx-f:first-child{ grid-column:1/-1; }
  .rcx-segb{ flex:1 1 100%; }
}