/* assets/bd-website-mobile.css — fix pack Session 12 (2026-09-29)
 *
 * Editing a live site from a phone.
 *
 * The editor panel is a laptop tool: 18 collapsible groups, section reordering, hex
 * colour fields. A contractor on a job site wants one of seven things — the phone
 * number, the email, the address, the hours, the service area, a photo, the headline —
 * and the page currently makes them scroll past everything else to find it, with the
 * phone and email not in the panel at all.
 *
 * Below 720px the panel opens on "Quick edits": those seven, each wired to the page's
 * own setter, saved by the same Save & Redeploy. The full panel is still there, one tap
 * away under "More edits (easier on a laptop)".
 *
 * Scoped to <=720px. Desktop is untouched.
 */

@media (max-width:720px){

  /* ── Quick edits ──────────────────────────────────────────────────────── */
  .bd-quickedits{ background:#fff; border:1px solid var(--border,#e3e1d9); padding:0.9rem 1rem 1rem; }
  .bd-qe-title{
    font-family:'Montserrat',sans-serif; font-size:0.68rem; font-weight:700;
    letter-spacing:0.16em; text-transform:uppercase; color:var(--dark,#1a1a18);
    margin-bottom:0.2rem;
  }
  .bd-qe-sub{ font-size:0.72rem; font-weight:300; color:var(--text-muted,#77756c); line-height:1.5; margin-bottom:0.85rem; }
  .bd-qe-field{ margin-bottom:0.75rem; }
  .bd-qe-field label{
    display:block; font-size:0.66rem; font-weight:600; letter-spacing:0.08em;
    text-transform:uppercase; color:var(--text-muted,#77756c); margin-bottom:0.25rem;
  }
  .bd-qe-field input, .bd-qe-field textarea{
    width:100%; min-height:44px; font-size:16px; padding:0.6rem 0.7rem;
    border:1px solid var(--border,#e3e1d9); background:#fff; color:var(--text,#2a2a27);
    font-family:'DM Sans',system-ui,sans-serif;
  }
  .bd-qe-field textarea{ min-height:66px; resize:vertical; }
  .bd-qe-photos{
    display:block; width:100%; min-height:48px; margin-top:0.2rem;
    background:var(--offwhite,#f7f6f2); border:1px solid var(--border,#e3e1d9);
    font-family:'Montserrat',sans-serif; font-size:0.7rem; font-weight:600;
    letter-spacing:0.1em; text-transform:uppercase; color:var(--dark,#1a1a18); cursor:pointer;
  }
  .bd-qe-more{
    display:block; width:100%; min-height:48px; margin-top:0.9rem;
    background:transparent; border:1px dashed var(--border,#e3e1d9);
    font-family:'Montserrat',sans-serif; font-size:0.68rem; font-weight:600;
    letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted,#77756c); cursor:pointer;
  }
  /* The full panel stays in the DOM and one tap away. */
  .bd-site-quick #deScroll{ display:none; }
  .bd-site-quick.bd-site-more #deScroll{ display:block; }
  .bd-site-more .bd-qe-more{ border-style:solid; }

  /* ── Words that assume a mouse and two columns ────────────────────────── */
  /* HIDDEN 2026-09-29 (fixpack S12): "left side / right side / click any section"
     describes a layout that doesn't exist on a phone. .bd-s3hb-phone replaces it. */
  /* body.bd-editor .s3hb-edit is display:block!important, so this has to match that
     specificity (body + two classes) to win on document order. */
  body.bd-site-quick .s3hb-build, body.bd-site-quick .s3hb-edit{ display:none !important; }
  .bd-s3hb-phone{ font-size:0.78rem; font-weight:300; color:var(--text,#2a2a27); line-height:1.65; }
  .bd-site-quick #step3HelpBanner{ padding:0.9rem 1rem; }
  .bd-site-quick #bs3c > div:first-child p{ display:none; }

  /* The preview's address bar is the "is this my site?" check — let it breathe. */
  .bd-site-quick .prev-url-bar{
    font-size:0.72rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  }

  /* ── Tap targets across the builder ───────────────────────────────────── */
  .bd-site-quick .pv-toggle button,
  .bd-site-quick .open-tab-btn,
  .bd-site-quick .de-add-btn,
  .bd-site-quick .b-btn-gold,
  .bd-site-quick .b-btn-back,
  .bd-site-quick summary{ min-height:44px; }
  .bd-site-quick .b-input, .bd-site-quick .de-input{ min-height:44px; font-size:16px; }
}