/* Functional page-template alignment and shared interactive states */
.business-page{grid-template-columns:minmax(0,2fr) minmax(250px,.78fr)!important}
.business-page .main-pane{order:1}
.business-page .left-pane{order:2}
.panel-body{padding:15px 16px}
.panel-body p{line-height:1.65}
.details-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.detail{border:1px solid var(--line,#e4e8e5);border-radius:9px;padding:12px;min-width:0}
.detail b{display:block;margin-bottom:5px}
.detail p{margin:0;color:var(--muted,#737d76);font-size:13px;overflow-wrap:anywhere}
.place-list{display:grid;gap:10px}
.place{display:flex;align-items:center;gap:10px;min-width:0}
.place img{width:58px;height:54px;object-fit:cover;border-radius:8px;flex-shrink:0}
.place-copy{display:grid;gap:3px;min-width:0}
.place-copy strong{font-size:13px;line-height:1.3}
.place-copy small{font-size:11px;color:var(--muted,#737d76)}
.person{display:flex;align-items:center;gap:10px;margin:8px 0}
.person-info{display:grid;gap:3px;min-width:0}
.person-info strong{font-size:13px}
.person-info small{font-size:11px;color:var(--muted,#737d76)}
.form-status{font-size:13px;margin:8px 0;padding:8px 10px;border-radius:7px}
.form-status:empty{display:none}
.form-status.success{background:#e9f5ec;color:#28633d}
.form-status.error{background:#fff0ee;color:#9b3028}
.form-status.pending{background:#f0f3f1;color:#55645a}
.upload-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px;margin-top:10px}
.upload-preview{min-width:0;border:1px solid var(--line,#e4e8e5);border-radius:8px;overflow:hidden;background:#f7f8f7}
.upload-preview img,.upload-preview video{width:100%;height:92px;object-fit:cover}
.upload-preview span{display:block;padding:5px 7px;font-size:11px;overflow-wrap:anywhere}
.upload-progress{margin-top:10px}
.upload-progress-track{height:7px;background:#e4e9e5;border-radius:99px;overflow:hidden}
.upload-progress-track span{display:block;height:100%;width:0;background:#397653;transition:width .12s}
.upload-progress small{display:block;margin-top:5px;color:var(--muted,#737d76)}
.story video,.reel video,.gallery-grid video{width:100%;height:100%;object-fit:cover}
.hero-actions form,.post-actions form{display:inline-flex;margin:0}
.hero-actions button,.post-actions button{cursor:pointer}
.post-copy{white-space:normal;overflow-wrap:anywhere}
.nearby-row{display:flex;align-items:center;gap:10px;padding:8px 0}
.nearby-row img{width:54px;height:48px;object-fit:cover;border-radius:7px;flex-shrink:0}
.nearby-row span{display:grid;gap:3px;min-width:0}
.nearby-row strong{font-size:12px}
.nearby-row small{font-size:11px;color:var(--muted,#737d76)}
.brand:hover,.post-name:hover,.place-copy strong:hover{text-decoration:none}
button:disabled{opacity:.65;cursor:wait}
@media(max-width:720px){.details-list{grid-template-columns:1fr}.profile-actions{flex-wrap:wrap}.profile-head{padding-left:14px;padding-right:14px}.hero-actions{gap:5px}.page{height:auto!important;min-height:0}.pane{overflow:visible;max-height:none}.left-pane{display:none}.right-pane{display:none}}

/* FIX 2026-10-21: restore actual multi-column page layouts.
   The earlier overrides changed .page to display:block, but the PHP template
   places .left-pane/.main-pane/.right-pane directly inside .page (no .layout wrapper). */
@media (min-width: 851px) {
  body.layout-business .page.business-page {
    display: grid !important;
    grid-template-columns: minmax(0, 2fr) minmax(270px, .78fr) !important;
    align-items: start;
    gap: 18px;
    width: 100%;
    max-width: 1500px;
    height: auto !important;
    min-height: calc(100vh - 70px);
    margin: 0 auto;
    padding: 20px 22px 30px;
    overflow: visible;
  }
  body.layout-business .page.business-page > .main-pane { order: 1; grid-column: 1; grid-row: 1; overflow: visible; min-height: 0; }
  body.layout-business .page.business-page > .left-pane { order: 2; grid-column: 2; grid-row: 1; overflow: visible; min-height: 0; }

  body.layout-destination .page.destination-page {
    display: grid !important;
    grid-template-columns: minmax(245px, .88fr) minmax(460px, 1.8fr) minmax(270px, 1fr) !important;
    align-items: start;
    gap: 16px;
    width: 100%;
    max-width: 1900px;
    height: auto !important;
    min-height: calc(100vh - 70px);
    margin: 0 auto;
    padding: 20px 22px 30px;
    overflow: visible;
  }
  body.layout-destination .page.destination-page > .left-pane { grid-column: 1; grid-row: 1; overflow: visible; }
  body.layout-destination .page.destination-page > .main-pane { grid-column: 2; grid-row: 1; overflow: visible; }
  body.layout-destination .page.destination-page > .right-pane { grid-column: 3; grid-row: 1; overflow: visible; display: block; }
}
@media (min-width: 851px) and (max-width: 1150px) {
  body.layout-destination .page.destination-page { grid-template-columns: minmax(210px, .8fr) minmax(0, 1.7fr) !important; }
  body.layout-destination .page.destination-page > .right-pane { grid-column: 1 / -1; grid-row: 2; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 14px; }
  body.layout-destination .page.destination-page > .right-pane > .right-heading { grid-column: 1 / -1; }
}
@media (max-width: 850px) {
  body.layout-business .page.business-page,
  body.layout-destination .page.destination-page { display: flex !important; flex-direction: column; height: auto !important; min-height: 0; padding: 10px; gap: 10px; }
  body.layout-business .page.business-page > .main-pane,
  body.layout-destination .page.destination-page > .main-pane { order: 1; overflow: visible; width: 100%; }
  body.layout-business .page.business-page > .left-pane,
  body.layout-destination .page.destination-page > .left-pane { order: 2; overflow: visible; width: 100%; }
  body.layout-destination .page.destination-page > .right-pane { order: 3; display: block; overflow: visible; width: 100%; }
}