/* Visual editor styles. Everything is scoped to edit mode. */
body.dj-edit-mode{padding-top:0}
body.dj-edit-mode:not(.menu-page) .announcement{top:0;margin-top:72px}
body.dj-edit-mode:not(.menu-page) .topbar{top:106px}
body.dj-edit-mode .mobile-bar{display:none!important}

.dj-editor-bar{
  position:fixed;z-index:100000;left:0;right:0;top:0;height:72px;
  display:flex;align-items:center;gap:12px;padding:10px 18px;
  background:#102d25;color:#fff;box-shadow:0 10px 30px rgba(0,0,0,.22);
  font-family:"DM Sans",sans-serif
}
.dj-editor-brand{display:flex;align-items:center;gap:10px;min-width:220px}
.dj-editor-brand strong{font-size:14px;letter-spacing:.06em}
.dj-editor-brand span{display:block;font-size:11px;opacity:.72;margin-top:2px}
.dj-editor-status{font-size:12px;opacity:.78;white-space:nowrap}
.dj-editor-spacer{flex:1}
.dj-editor-btn{
  appearance:none;border:1px solid rgba(255,255,255,.22);background:transparent;color:#fff;
  border-radius:999px;padding:10px 14px;font:700 12px/1 "DM Sans",sans-serif;cursor:pointer
}
.dj-editor-btn:hover{background:rgba(255,255,255,.1)}
.dj-editor-btn.primary{background:#f6c445;border-color:#f6c445;color:#173d31}
.dj-editor-btn.primary:hover{filter:brightness(.96)}
.dj-editor-btn:disabled{opacity:.45;cursor:not-allowed}
.dj-editor-dirty{width:8px;height:8px;border-radius:50%;background:#f6c445;display:none}
body.dj-has-changes .dj-editor-dirty{display:block}

.dj-editable{
  position:relative!important;
  outline:2px dashed rgba(246,196,69,.0);
  outline-offset:5px;border-radius:4px;transition:outline-color .16s,background .16s;
  cursor:text
}
.dj-editable:hover{
  outline-color:#f6c445;
  background:rgba(246,196,69,.10)
}
.dj-editable:hover::after{
  content:"✎ " attr(data-edit-label);
  position:absolute;z-index:9999;left:0;top:-31px;
  background:#102d25;color:#fff;border-radius:6px;padding:6px 8px;
  font:700 10px/1 "DM Sans",sans-serif;letter-spacing:.03em;white-space:nowrap;
  pointer-events:none;box-shadow:0 5px 14px rgba(0,0,0,.2)
}
.dj-editable[contenteditable="true"]{
  outline-color:#f6c445;background:rgba(246,196,69,.13);
  min-width:24px
}
.dj-editable[contenteditable="true"]:focus{outline-style:solid}

.dj-edit-photo{position:relative!important;cursor:pointer;outline:2px dashed transparent;outline-offset:4px}
.dj-edit-photo:hover{outline-color:#f6c445}
.dj-edit-photo::after{
  content:"📷 Replace photo";position:absolute;z-index:50;left:50%;top:50%;transform:translate(-50%,-50%);
  background:#102d25;color:#fff;padding:10px 14px;border-radius:999px;
  font:700 12px/1 "DM Sans",sans-serif;opacity:0;transition:opacity .15s;pointer-events:none;
  white-space:nowrap;box-shadow:0 8px 24px rgba(0,0,0,.28)
}
.dj-edit-photo:hover::after{opacity:1}

.dj-editor-login{
  position:fixed;z-index:100001;inset:0;background:rgba(12,25,21,.78);backdrop-filter:blur(8px);
  display:grid;place-items:center;padding:24px;font-family:"DM Sans",sans-serif
}
.dj-editor-login-card{
  width:min(460px,100%);background:#fff;border-radius:24px;padding:30px;
  box-shadow:0 30px 80px rgba(0,0,0,.35);color:#173d31
}
.dj-editor-login-card h2{font-family:"Fraunces",serif;font-size:34px;margin:0 0 8px}
.dj-editor-login-card p{line-height:1.55;color:#4d5f58;margin:0 0 20px}
.dj-editor-login-card label{font-size:12px;font-weight:800;display:block;margin-bottom:8px}
.dj-editor-login-card input{
  width:100%;box-sizing:border-box;border:1px solid #ccd5d1;border-radius:10px;
  padding:13px 14px;font:600 16px "DM Sans",sans-serif;margin-bottom:12px
}
.dj-editor-login-card button{
  width:100%;border:0;border-radius:999px;background:#f6c445;color:#173d31;
  padding:13px 18px;font:800 14px "DM Sans",sans-serif;cursor:pointer
}
.dj-editor-login-error{min-height:20px;color:#a12a22!important;font-size:13px;margin:10px 0 0!important}
.dj-editor-help{
  position:fixed;z-index:99998;right:16px;bottom:18px;background:#fff;color:#173d31;
  border:1px solid rgba(23,61,49,.14);box-shadow:0 12px 30px rgba(0,0,0,.14);
  border-radius:14px;padding:12px 14px;font:600 12px/1.45 "DM Sans",sans-serif;max-width:260px
}
.dj-editor-toast{
  position:fixed;z-index:100002;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);
  opacity:0;background:#102d25;color:#fff;border-radius:999px;padding:11px 16px;
  font:700 12px "DM Sans",sans-serif;transition:.2s;pointer-events:none
}
.dj-editor-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media(max-width:800px){
  body.dj-edit-mode{padding-top:0}
  body.dj-edit-mode:not(.menu-page) .announcement{margin-top:118px}
  body.dj-edit-mode:not(.menu-page) .topbar{top:148px}
  .dj-editor-bar{height:auto;min-height:98px;flex-wrap:wrap;padding:10px 12px}
  .dj-editor-brand{min-width:0;flex:1}
  .dj-editor-spacer{display:none}
  .dj-editor-status{order:3;width:100%}
  .dj-editor-btn{padding:9px 11px}
  .dj-editor-help{display:none}
}


/* Menu edit mode */
body.dj-menu-edit-mode .menu-toolbox{position:sticky;top:72px;z-index:80}
body.dj-menu-edit-mode .menu-section{position:relative;padding-top:10px}
body.dj-menu-edit-mode .menu-section-head{position:relative;padding-right:110px}
.dj-menu-add{
  position:absolute;right:0;top:50%;transform:translateY(-50%);
  border:1px solid #173d31;background:#fff;color:#173d31;border-radius:999px;
  padding:8px 11px;font:800 11px/1 "DM Sans",sans-serif;cursor:pointer
}
.dj-menu-add:hover{background:#f6c445;border-color:#f6c445}
body.dj-menu-edit-mode .menu-item{
  position:relative!important;
  padding-top:54px;
  outline:1px solid rgba(23,61,49,.12);
  border-radius:12px;
  transition:outline-color .15s,box-shadow .15s
}
body.dj-menu-edit-mode .menu-item:hover{
  outline:2px solid #f6c445;
  box-shadow:0 8px 22px rgba(0,0,0,.06)
}
.dj-menu-controls{
  position:absolute;left:12px;right:12px;top:10px;
  display:flex;gap:6px;align-items:center;flex-wrap:wrap;
  font-family:"DM Sans",sans-serif
}
.dj-menu-control{
  border:1px solid rgba(23,61,49,.22);background:#fff;color:#173d31;
  border-radius:999px;padding:7px 9px;font:800 10px/1 "DM Sans",sans-serif;cursor:pointer
}
.dj-menu-control:hover{background:#f7efd9}
.dj-menu-control.active{background:#173d31;color:#fff;border-color:#173d31}
.dj-menu-control.sold.active{background:#8b2d26;border-color:#8b2d26}
.dj-menu-control.delete{margin-left:auto;color:#a12a22;border-color:rgba(161,42,34,.25)}
.dj-menu-control.delete:hover{background:#fff0ee}
body.dj-menu-edit-mode .menu-item-name,
body.dj-menu-edit-mode .menu-item-description,
body.dj-menu-edit-mode .menu-item-price,
body.dj-menu-edit-mode .menu-section-head h2{
  outline:2px dashed transparent;outline-offset:3px;border-radius:4px;cursor:text
}
body.dj-menu-edit-mode .menu-item-name:hover,
body.dj-menu-edit-mode .menu-item-description:hover,
body.dj-menu-edit-mode .menu-item-price:hover,
body.dj-menu-edit-mode .menu-section-head h2:hover{
  outline-color:#f6c445;background:rgba(246,196,69,.12)
}
body.dj-menu-edit-mode [contenteditable="true"]{
  outline:2px solid #f6c445!important;background:rgba(246,196,69,.14)!important
}
.sold-out-badge{
  display:inline-block;margin-left:8px;padding:4px 7px;border-radius:999px;
  background:#8b2d26;color:#fff;font:800 9px/1 "DM Sans",sans-serif;vertical-align:middle
}
.menu-item.sold-out{opacity:.62}
.menu-item.sold-out .menu-item-name{text-decoration:line-through}
.dj-menu-empty-desc{opacity:.48;font-style:italic}

@media(max-width:800px){
  body.dj-menu-edit-mode .menu-toolbox{top:118px}
  body.dj-menu-edit-mode .menu-section-head{padding-right:0;padding-bottom:44px}
  .dj-menu-add{top:auto;bottom:4px;left:0;right:auto;transform:none}
  .dj-menu-controls{position:static;margin:-35px 0 16px}
  body.dj-menu-edit-mode .menu-item{padding-top:20px}
  .dj-menu-control.delete{margin-left:0}
}

.dj-section-controls{
  position:absolute;right:108px;top:50%;transform:translateY(-50%);
  display:flex;gap:5px;align-items:center
}
.dj-section-controls button{
  border:1px solid rgba(23,61,49,.18);background:#fff;color:#173d31;border-radius:999px;
  padding:7px 9px;font:800 10px/1 "DM Sans",sans-serif;cursor:pointer
}
.dj-section-controls button:hover:not(:disabled){background:#f7efd9}
.dj-section-controls button.danger{color:#a12a22}
.dj-section-controls button:disabled,.dj-menu-control:disabled{opacity:.28;cursor:not-allowed}
body.dj-menu-edit-mode .menu-section-head{padding-right:300px}
body.dj-menu-edit-mode .menu-section-head h2{min-width:90px}
@media(max-width:900px){
  body.dj-menu-edit-mode .menu-section-head{padding-right:0;padding-bottom:82px}
  .dj-section-controls{left:0;right:auto;top:auto;bottom:42px;transform:none}
  .dj-menu-add{top:auto;bottom:4px;left:0;right:auto;transform:none}
}

/* Dish drag-and-drop ordering */
.dj-menu-drag{
  border:1px solid #173d31;background:#173d31;color:#fff;border-radius:999px;
  padding:7px 10px;font:800 10px/1 "DM Sans",sans-serif;cursor:grab;
  user-select:none
}
.dj-menu-drag:active{cursor:grabbing}
body.dj-menu-edit-mode .menu-item.dj-dragging{opacity:.35}
body.dj-menu-edit-mode .menu-item.dj-drop-before::before,
body.dj-menu-edit-mode .menu-item.dj-drop-after::after{
  content:"Drop dish here";position:absolute;z-index:25;left:0;right:0;height:3px;
  background:#f6c445;color:#173d31;font:800 10px/1 "DM Sans",sans-serif;
  text-align:center;line-height:18px
}
body.dj-menu-edit-mode .menu-item.dj-drop-before::before{top:-7px}
body.dj-menu-edit-mode .menu-item.dj-drop-after::after{bottom:-7px}

.dj-menu-drag{touch-action:none}
body.dj-is-sorting{user-select:none}
body.dj-is-sorting .dj-menu-drag{cursor:grabbing}

/* Full-page visual editing */
body.dj-edit-mode .dj-editable-page{outline:1px dashed rgba(240,186,60,.45);outline-offset:3px;cursor:text}
body.dj-edit-mode .dj-editable-page:hover{outline:2px solid var(--maize);background:rgba(240,186,60,.08)}
body.dj-edit-mode img.dj-editable-image{cursor:pointer;outline:2px dashed rgba(240,186,60,.55);outline-offset:3px}
body.dj-edit-mode img.dj-editable-image:hover{outline:3px solid var(--maize);filter:brightness(.92)}

.dj-turnstile-wrap{margin:0 0 14px;display:flex;flex-direction:column;align-items:center;gap:7px}
.dj-turnstile-wrap[hidden]{display:none}
.dj-turnstile-wrap>span{font-size:11px;color:#5c6d66}
.dj-editor-login-card button:disabled{opacity:.58;cursor:wait}