:root{
  --rm-bg:#f9fafb;
  --rm-card:#ffffff;
  --rm-border:#e5e7eb;
  --rm-text:#111827;
  --rm-muted:#6b7280;
  --rm-shadow:0 10px 30px rgba(17,24,39,.06);
  --rm-primary:#111827;
  --rm-primary-soft:rgba(17,24,39,.08);
}

.rm-wrap{
  max-width:980px;
  margin:24px auto;
  padding:16px;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;
  color:var(--rm-text);
}

@media (max-width:640px){
  /* Reduce side padding on small screens to avoid the "too narrow" feeling */
  .rm-wrap{ margin:14px auto; padding:10px; }
  .rm-card{ padding:14px; border-radius:14px; }
}

.rm-card{
  border:1px solid var(--rm-border);
  border-radius:16px;
  padding:16px;
  margin:12px 0;
  background:var(--rm-card);
  box-shadow:var(--rm-shadow);
}

.rm-title{font-size:22px;font-weight:800;letter-spacing:-.2px}
.rm-subtitle{font-size:14px;font-weight:800;letter-spacing:-.1px}
.rm-help{color:#4b5563;font-size:14px;line-height:1.55;margin-top:6px}
.rm-mini{color:var(--rm-muted);font-size:12px;line-height:1.45;margin-top:6px}

.rm-label{
  display:block;
  margin-top:12px;
  margin-bottom:6px;
  font-size:13px;
  font-weight:700;
  color:#374151;
}

.rm-input{
  width:100%;
  border:1px solid var(--rm-border);
  border-radius:12px;
  padding:11px 12px;
  font-size:14px;
  outline:none;
  background:#fff;
  color:var(--rm-text);
  transition:border-color .15s, box-shadow .15s;
}

.rm-input:focus{
  border-color:var(--rm-primary);
  box-shadow:0 0 0 3px var(--rm-primary-soft);
}

.rm-textarea{min-height:70px;resize:vertical}

.rm-row{display:flex;gap:12px;flex-wrap:wrap}
.rm-col{flex:1;min-width:220px}
.rm-grid{display:grid;grid-template-columns:1fr 220px;gap:12px}
@media (max-width:720px){ .rm-grid{grid-template-columns:1fr} }

.rm-hr{height:1px;background:var(--rm-border);margin:14px 0}

.rm-btn{
  appearance:none;
  border:1px solid transparent;
  border-radius:12px;
  padding:10px 12px;
  font-weight:800;
  font-size:14px;
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  user-select:none;
}

.rm-btn-primary{background:#111827;color:#fff}
.rm-btn-primary:hover{filter:brightness(1.05)}
.rm-btn-ghost{background:#fff;border-color:var(--rm-border);color:var(--rm-text)}
.rm-btn-ghost:hover{background:#f3f4f6}
.rm-btn-danger{background:#fff;border-color:#fecaca;color:#991b1b}
.rm-btn-danger:hover{background:#fff1f2}

.rm-ok{
  background:#ecfdf5;
  border:1px solid #a7f3d0;
  color:#065f46;
  padding:12px 12px;
  border-radius:12px;
  font-weight:700;
}

.rm-error{
  background:#fef2f2;
  border:1px solid #fecaca;
  color:#991b1b;
  padding:12px 12px;
  border-radius:12px;
  font-weight:700;
}

.rm-box{
  border:1px solid var(--rm-border);
  border-radius:16px;
  padding:14px;
  background:#fff;
  box-shadow:var(--rm-shadow);
  margin-bottom:12px;
}

.rm-h{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  margin-bottom:10px;
}

.rm-left{display:flex;gap:10px;align-items:flex-start}
.rm-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

.rm-handle{
  width:30px;height:30px;
  border:1px solid var(--rm-border);
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  cursor:grab;
  color:#111827;
  user-select:none;
}
.rm-handle:active{cursor:grabbing}

.rm-items{display:flex;flex-direction:column;gap:12px;margin-top:12px}

.rm-item{
  border:1px solid var(--rm-border);
  border-radius:16px;
  padding:12px;
  background:#fff;
}

.rm-photo-preview{
  border:1px dashed var(--rm-border);
  border-radius:14px;
  padding:10px;
  margin-top:10px;
  background:#fafafa;
}
.rm-photo-preview img{width:100%;height:auto;border-radius:12px;display:block}
.rm-photo-preview.is-empty{background:#fff}

.rm-sort-placeholder{
  border:2px dashed #cbd5e1;
  border-radius:16px;
  height:56px;
  background:#f8fafc;
}

.is-loading{opacity:.85}

.rm-wrap,.rm-wrap *{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif !important;}


.rm-wrap a, .rm-wrap a:visited, .rm-wrap a:hover, .rm-wrap a:active {
  text-decoration: none !important;
}


/* Draft toast */
.rm-toast{border:1px solid #e5e7eb;border-radius:14px;padding:10px 12px;margin-bottom:12px;background:#fff;box-shadow:0 10px 30px rgba(17,24,39,.06);display:flex;justify-content:space-between;align-items:center;gap:10px;font-weight:700;color:#111827}
.rm-toast-x{border:0;background:transparent;font-size:18px;line-height:1;cursor:pointer;color:#6b7280}


/* v3 additions */
.rm-dirty{font-size:12px;font-weight:800;background:#fee2e2;color:#991b1b;border:1px solid #fecaca;padding:6px 10px;border-radius:999px;white-space:nowrap}
.rm-btn.is-disabled, .rm-btn:disabled{opacity:.55;cursor:not-allowed}
.rm-empty{padding:14px;border:1px dashed #e5e7eb;border-radius:16px;background:#fafafa;text-align:center}


/* Unsaved indicator */
#rmUnsaved{display:none;margin-top:10px;padding:10px 12px;border:1px solid #fbbf24;background:#fffbeb;border-radius:14px;font-weight:800;color:#92400e}
#rmSaveBtn.is-disabled{opacity:.5;cursor:not-allowed}

/* When there are unsaved changes, slightly emphasize the save button */
#rmSaveBtn.rm-btn-dirty{box-shadow:0 0 0 3px rgba(251,191,36,.35)}

/* Bottom action bar (builder) */
.rm-bottombar{margin-top:14px;display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}
.rm-bottombar-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.rm-bottombar-save{display:flex;justify-content:center}
.rm-bottombar-save #rmSaveBtn{min-width:240px}
@media (max-width:520px){.rm-bottombar{flex-direction:column}.rm-bottombar-save #rmSaveBtn{width:100%}}

/* Welcome message card spacing */
.rm-welcome-card #rm_welcome{margin-top:10px}

/* Empty state */
.rm-empty{padding:18px;border:1px dashed #e5e7eb;border-radius:16px;background:#f9fafb;text-align:center}
.rm-empty-title{font-weight:900;color:#111827}
.rm-empty-desc{margin-top:6px;color:#6b7280;font-size:13px}
.rm-empty-btn{margin-top:12px}
/* === RahatMenu: Foto onizleme sabitleme (120px) === */
.rm-photo-preview{
  border:1px dashed var(--rm-border);
  border-radius:14px;
  padding:10px;
  margin-top:10px;
  background:#fafafa;

  height:120px !important;
  overflow:hidden !important;

  display:flex;
  align-items:center;
  justify-content:center;
}

.rm-photo-preview img{
  max-width:100% !important;
  max-height:100% !important;

  width:auto !important;
  height:100% !important;

  object-fit:contain !important;
  border-radius:12px;
  display:block;
}
/* === Fotoğraf önizleme sabitleme (120px) === */
.rm-photo-preview{
  height:120px;

}

/* =============================
   RahatMenu Builder UI polish
   (no layout logic changes)
============================= */

/* Separator (Menü Oluşturma) */
.rm-separator{margin:18px 0 10px 0;padding:14px 14px;border:1px solid var(--rm-border);border-radius:16px;background:linear-gradient(180deg,#ffffff 0%, #f9fafb 100%);box-shadow:var(--rm-shadow)}
.rm-sep-title{font-weight:900;letter-spacing:-.2px;font-size:16px;color:var(--rm-text)}
.rm-sep-sub{margin-top:6px;color:var(--rm-muted);font-size:13px;line-height:1.45}

/* Section cards */
.rm-section-card{border:1px solid var(--rm-border);border-radius:18px;padding:14px;background:#fff;box-shadow:var(--rm-shadow);margin:14px 0;transition:transform .12s ease, box-shadow .12s ease}
.rm-section-card:hover{transform:translateY(-1px)}
.rm-row-between{justify-content:space-between;align-items:center}
.rm-section-title-input{font-size:16px;font-weight:900;padding:12px 12px}

/* Item cards */
.rm-item-card{border:1px solid var(--rm-border);border-radius:18px;padding:12px;background:#fff;transition:transform .12s ease, box-shadow .12s ease}
.rm-item-card:hover{transform:translateY(-1px)}
.rm-item-main{display:flex;gap:12px;flex-wrap:wrap}
.rm-item-texts{flex:1;min-width:240px}
.rm-item-side{width:160px;min-width:160px;display:flex;flex-direction:column;gap:10px;align-items:stretch}
@media (max-width:720px){.rm-item-side{width:100%;min-width:0;flex-direction:row}.rm-item-side .rm-item-price{flex:1}.rm-item-side .rm-item-remove{flex:1}}
.rm-item-name{font-weight:800}
.rm-item-desc{min-height:54px}
.rm-item-price{text-align:right;font-weight:900}

/* Photo row layout */
.rm-photo-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-start;margin-top:10px}
.rm-photo-preview{flex:1;min-width:220px}
.rm-photo-actions{width:240px;min-width:240px;display:flex;flex-direction:column;gap:8px}
@media (max-width:720px){.rm-photo-actions{width:100%;min-width:0}}

/* Button sizing */
.rm-btn-small{padding:8px 10px;border-radius:12px;font-size:13px;font-weight:900}

/* Big “add” buttons (app-like) */
#rm_add_section_bottom,
[data-sec-add-item]{
  width:100%;
  background:#f9fafb;
  border:2px dashed #d1d5db;
  color:#111827;
  padding:12px 14px;
  border-radius:16px;
  font-weight:900;
}
#rm_add_section_bottom:hover,
[data-sec-add-item]:hover{background:#fff;box-shadow:0 0 0 3px rgba(17,24,39,.06)}

/* Bottom action bar looks like an app toolbar */
.rm-bottombar{position:static;bottom:auto;z-index:auto;background:transparent;backdrop-filter:none;border:0;border-radius:0;padding:0;box-shadow:none;margin-top:14px}
 .rm-bottombar-actions{flex:1;min-width:0}
 .rm-bottombar-save{min-width:0}
.rm-bottombar-save #rmSaveBtn{border-radius:16px;padding:12px 16px;font-size:15px}

/* Unsaved indicator as a compact status pill */
#rmUnsaved{border-radius:14px;font-size:13px;line-height:1.35}

/* Business/Logo/Social box inside welcome card */
.rm-welcome-field{margin-top:10px}
.rm-welcome-field .rm-welcome{min-height:90px}
.rm-business-box{
  margin-top:16px;
  padding:16px 0 0;
  border-top:1px solid var(--rm-border);
  border-left:0;
  border-right:0;
  border-bottom:0;
  border-radius:0;
  background:transparent;
}

.rm-subsubtitle{font-weight:700;color:#111827;font-size:14px;margin-top:0}
.rm-logo-row{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-top:8px}
.rm-logo-preview{width:120px;height:90px;border:1px dashed #d1d5db;border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#f9fafb}
.rm-logo-preview img{max-width:100%;max-height:100%;object-fit:contain}
.rm-logo-empty{color:#6b7280;font-size:12px;padding:8px;text-align:center}
.rm-logo-actions{flex:1;min-width:220px}
.rm-radio{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:14px;color:#111827}
.rm-social-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
@media (max-width:640px){ .rm-social-grid{grid-template-columns:1fr} .rm-logo-actions{min-width:0} }


/* Responsive fix: prevent file input overflow on mobile */
.rm-logo-actions input[type="file"]{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  font-size:14px;
}
@media (max-width:640px){
  .rm-logo-row{flex-direction:column;align-items:stretch}
  .rm-logo-preview{margin:0 auto}
  .rm-logo-actions{width:100%}
}


/* Make logo remove button align better with native file picker */
.rm-logo-remove{padding:6px 10px;font-size:13px;border-radius:10px;line-height:1.2}

.rm-logo-actions .rm-logo-remove{margin-top:8px}
/* === Ürün kartı düzeni (net hiyerarşi) === */

/* === Ürün kartı düzeni (net hiyerarşi) === */
.rm-item-head{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.rm-item-head .rm-item-name{flex:1;min-width:260px;font-weight:900}
.rm-item-head .rm-item-price{width:140px;min-width:140px;text-align:right;font-weight:900}
.rm-item-head .rm-item-remove{white-space:nowrap}

.rm-item-desc{margin-top:10px;min-height:56px}

.rm-item-photo{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-start;margin-top:10px}
.rm-item-photo .rm-photo-actions{width:240px;min-width:240px;display:flex;flex-direction:column;gap:8px}
.rm-item-photo .rm-photo-preview{flex:1;min-width:220px}
.rm-file{padding:9px 10px;font-size:13px;border-radius:12px}

@media (max-width:720px){
  .rm-item-head .rm-item-name{min-width:100%}
  .rm-item-head .rm-item-price{flex:1;width:auto;min-width:0}
  .rm-item-head .rm-item-remove{flex:0 0 auto}
  .rm-item-photo .rm-photo-actions{width:100%;min-width:0}
}