/* Listing Builder page: builds on styles.css (same tokens, cards, chips and tables). */

.spacer { flex: 1; }
code, .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; }
code { background: #f1f2f6; padding: 1px 5px; border-radius: 4px; }
.lb-sub { color: var(--muted); font-size: 14px; }

/* buttons & inputs */
.btn {
  display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; border-radius: 22px;
  border: 1px solid #c9ccd6; background: #fff; font-weight: 700; font-size: 14px; text-decoration: none;
  color: var(--text); white-space: nowrap; cursor: pointer;
}
.btn svg { width: 17px; height: 17px; }
.btn:hover { border-color: var(--primary); color: var(--primary); }
.btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.btn.primary:hover { background: #4a3be0; color: #fff; }
.btn.ghost { background: #fff; }
.btn.danger { background: #e5484d; border-color: #e5484d; color: #fff; }
.btn.small { padding: 5px 12px; font-size: 13px; }
.btn:disabled, .btn[disabled] { opacity: .45; cursor: not-allowed; pointer-events: none; }
.danger-text, .menu .danger-text { color: #d13438 !important; }
.icon-btn:disabled { opacity: .35; cursor: default; }
.icon-btn.light { background: rgba(255,255,255,.92); color: var(--text); width: 30px; height: 30px; border-radius: 8px; }
.icon-btn.light svg { width: 16px; height: 16px; }
.input {
  width: 100%; font: inherit; font-size: 14.5px; padding: 9px 12px; border: 1px solid #d5d8e0; border-radius: 10px;
  background: #fff; color: var(--text); outline: none;
}
.input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
textarea.input { resize: vertical; line-height: 1.5; }
.chip select { border: 0; background: transparent; font: inherit; color: inherit; outline: none; cursor: pointer; }
.menu .menu-a { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 6px; color: inherit; text-decoration: none; }
.menu .menu-a:hover { background: var(--bg); }
.menu .menu-a svg { width: 18px; height: 18px; color: var(--muted); }

.spin { width: 16px; height: 16px; border: 2px solid var(--primary-soft); border-top-color: var(--primary); border-radius: 50%; display: inline-block; animation: spin .8s linear infinite; flex-shrink: 0; }
.btn.primary .spin { border-color: rgba(255,255,255,.35); border-top-color: #fff; }
.spin.big { width: 32px; height: 32px; border-width: 3px; }
@keyframes spin { to { transform: rotate(360deg); } }

/* layout pieces */
.page-head .spacer { flex: 1; }
.lb-card { padding: 20px 22px; margin-bottom: 16px; }
.lb-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.lb-card-head h2 { font-size: 18px; margin: 0 0 4px; font-weight: 800; }
.lb-card-head h2 .muted { font-weight: 600; font-size: 15px; }
.lb-card-head p { margin: 0; font-size: 14px; max-width: 75ch; }
.lb-row { display: flex; align-items: center; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.lb-row.tight { margin-top: 0; gap: 8px; }
.lb-empty { padding: 60px 24px; text-align: center; color: var(--muted); display: flex; flex-direction: column; align-items: center; gap: 6px; }
.lb-empty svg { width: 40px; height: 40px; color: #c3c7d1; }
.lb-empty h3 { color: var(--text); margin: 8px 0 0; }
.lb-empty a { color: var(--primary); }

.lb-banner { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 12px; margin-bottom: 16px; font-size: 14.5px; }
.lb-banner > div { flex: 1; }
.lb-banner svg { width: 22px; height: 22px; }
.lb-banner.warn { background: #fff6e5; border: 1px solid #f5d79a; color: #7a4d00; }
.lb-banner.bad { background: #fdeeee; border: 1px solid #f3c1c1; color: #8f1d1d; }
.lb-banner.info { background: var(--primary-soft); border: 1px solid #d6d1ff; color: #3a2fa8; }
.lb-note { background: var(--primary-soft); color: #3a2fa8; padding: 8px 12px; border-radius: 8px; font-size: 13.5px; margin: 0 0 14px; }
.lb-caption { color: var(--muted); font-size: 13px; margin: 10px 0 0; }
.lb-link { display: inline-flex; align-items: center; gap: 6px; color: var(--primary); text-decoration: none; font-weight: 700; font-size: 14px; margin-top: 12px; }
.lb-link svg { width: 17px; height: 17px; }
.lb-ok { display: flex; gap: 8px; align-items: flex-start; color: #1f7a4d; font-size: 14px; margin: 0 0 12px; }
.lb-ok svg { width: 18px; height: 18px; color: var(--green); margin-top: 1px; }

/* already-built check */
.lb-check { margin-top: 16px; border: 1px solid #f5d79a; background: #fffaf0; border-radius: 12px; padding: 14px 16px; }
.lb-check-head { display: flex; gap: 10px; font-size: 14.5px; color: #7a4d00; }
.lb-check-head svg { color: #d99a00; }
.lb-check-list { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.lb-check-list label { display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 8px 12px; cursor: pointer; font-size: 14px; }
.lb-check-list input { accent-color: var(--primary); }

/* job */
.lb-progress { height: 6px; border-radius: 3px; background: #eef0f5; overflow: hidden; margin-bottom: 8px; }
.lb-progress i { display: block; height: 100%; background: var(--primary); transition: width .4s; }
.lb-items { list-style: none; padding: 0; margin: 0; }
.lb-items li { display: flex; align-items: flex-start; gap: 12px; padding: 12px 4px; border-bottom: 1px solid var(--border); }
.lb-items li:last-child { border-bottom: 0; }
.lb-items li > .spin, .lb-items li > .dot { margin-top: 2px; }
.lb-item-main { flex: 1; display: flex; flex-direction: column; gap: 2px; font-size: 14.5px; }
.lb-item-main .muted { font-size: 13px; }
.lb-item-state { font-size: 13.5px; color: var(--muted); }
.lb-err { color: #8f1d1d; font-size: 13.5px; margin: 4px 0; }
.dot { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; }
.dot svg { width: 13px; height: 13px; stroke-width: 3; color: #fff; }
.dot.ok { background: var(--green); }
.dot.bad { background: #e5484d; }
.dot.idle { border: 2px dashed #c9ccd6; }
.lb-log {
  background: #121a2c; color: #c9d1e6; font-family: ui-monospace, Menlo, monospace; font-size: 12px; line-height: 1.55;
  padding: 12px 14px; border-radius: 10px; margin: 12px 0 0; max-height: 220px; overflow: auto; white-space: pre-wrap;
}

/* listings table */
.lb-filters { gap: 12px; }
.seg { display: inline-flex; background: #f1f2f6; border-radius: 22px; padding: 3px; }
.seg button { border: 0; background: transparent; padding: 6px 14px; border-radius: 20px; font-weight: 700; font-size: 14px; color: var(--muted); }
.seg button span { font-weight: 600; opacity: .7; margin-left: 2px; }
.seg button.on { background: #fff; color: var(--primary); box-shadow: 0 1px 3px rgba(20,25,40,.12); }
.lb-table td { padding: 10px 14px; }
.lb-table tr.clickable { cursor: pointer; }
.lb-table .cb { width: 36px; padding-right: 0; }
.lb-table input[type=checkbox] { accent-color: var(--primary); width: 16px; height: 16px; cursor: pointer; }
.lb-thumb { width: 84px; height: 47px; object-fit: cover; border-radius: 8px; display: block; background: #f3f4f6; }
.lb-thumb.none { display: grid; place-items: center; color: #b3b7c2; border: 1px solid var(--border); }
.lb-name { font-weight: 700; }
.lb-addr { color: var(--muted); font-size: 13px; max-width: 360px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lb-addr.big { font-size: 14.5px; max-width: none; white-space: normal; display: flex; gap: 6px; align-items: center; margin-top: 4px; }
.lb-addr.big svg { width: 17px; height: 17px; }
.badge + .badge { margin-left: 4px; }
.badge.soft { background: #fff8eb; border: 1px solid #f5d79a; }
.badge.red { background: #fdeeee; color: #b42318; }
.badge.dark { background: rgba(18,26,44,.78); color: #fff; }

/* detail */
.lb-crumb { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 14px; margin: 0 0 12px; }
.lb-crumb a { display: inline-flex; align-items: center; gap: 6px; color: var(--primary); text-decoration: none; font-weight: 700; }
.lb-crumb svg { width: 17px; height: 17px; }
.lb-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.lb-title { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.lb-title h1 { font-size: 26px; font-weight: 800; margin: 0; }
.lb-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px 24px; padding: 18px 22px; margin-bottom: 16px; }
.lb-facts b { display: block; font-size: 12.5px; color: var(--muted); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; margin-bottom: 3px; }
.lb-facts span { font-size: 15px; }
.lb-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); gap: 16px; align-items: start; }
.lb-col { min-width: 0; }

.lb-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.lb-gallery .lb-photo.hero { grid-column: span 2; grid-row: span 2; }
.lb-gallery.small { grid-template-columns: repeat(4, 1fr); margin-top: 12px; }
.lb-photo { margin: 0; min-width: 0; }
.lb-img { position: relative; aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; background: #f1f2f6; }
.lb-photo.hero .lb-img { box-shadow: 0 0 0 3px var(--primary); }
.lb-photo.extra .lb-img { outline: 2px dashed #8a7ff5; outline-offset: 2px; }
.lb-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lb-noimg { width: 100%; height: 100%; display: grid; place-items: center; color: #b3b7c2; }
.lb-tags { position: absolute; top: 8px; left: 8px; display: flex; gap: 4px; flex-wrap: wrap; }
.lb-photo-actions {
  position: absolute; inset: auto 0 0 0; padding: 10px; display: flex; gap: 6px; justify-content: flex-end; align-items: center;
  background: linear-gradient(transparent, rgba(10,14,25,.6)); opacity: 0; transition: opacity .15s;
}
.lb-photo-actions .btn { border: 0; }
.lb-img:hover .lb-photo-actions, .lb-img:focus-within .lb-photo-actions { opacity: 1; }
@media (hover: none) { .lb-photo-actions { opacity: 1; } }
.lb-photo figcaption { font-size: 12.5px; color: var(--muted); margin-top: 6px; line-height: 1.35; }

.lb-stepper { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.lb-stepper .icon-btn { width: 30px; height: 30px; border: 1px solid var(--border); font-size: 18px; font-weight: 700; color: var(--text); }
.lb-stepper b { min-width: 16px; text-align: center; }

.lb-details { margin-top: 16px; border-top: 1px solid var(--border); padding-top: 12px; }
.lb-details summary { cursor: pointer; font-weight: 700; color: var(--primary); font-size: 14.5px; list-style: none; display: flex; align-items: center; gap: 6px; }
.lb-details summary::-webkit-details-marker { display: none; }
.lb-details summary::before { content: '›'; font-size: 20px; line-height: 1; transition: transform .15s; display: inline-block; }
.lb-details[open] summary::before { transform: rotate(90deg); }
.lb-details p { font-size: 14px; }

.lb-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 12px; }
.lb-form.one { grid-template-columns: 1fr; }
.lb-form .wide { grid-column: 1 / -1; }
.field { display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; font-weight: 700; }
.field > span { color: #3d4454; }
.field small { font-weight: 400; }
.field input[type=range] { accent-color: var(--primary); }
.check { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.check input { accent-color: var(--primary); width: 16px; height: 16px; }
.lb-form .lb-row { margin-top: 0; }

.lb-say { font-size: 15.5px; line-height: 1.6; margin: 0 0 12px; max-width: 75ch; }
.lb-two { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.lb-two h4 { margin: 8px 0 6px; font-size: 14px; }
.lb-two ul { margin: 0; padding-left: 18px; font-size: 14px; line-height: 1.55; }
.lb-reviews { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; max-height: 420px; overflow-y: auto; }
.lb-reviews > div { font-size: 14px; border-bottom: 1px solid var(--border); padding-bottom: 10px; }
.lb-reviews p { margin: 4px 0 0; line-height: 1.5; }
.lb-reviews a { color: var(--primary); }

.lb-tag-group { display: flex; gap: 12px; margin: 8px 0; align-items: baseline; }
.lb-tag-group > b { width: 110px; flex: none; font-size: 13px; color: var(--muted); }
.lb-tag-group > div { display: flex; flex-wrap: wrap; gap: 6px; }
.lb-tag { font-size: 13px; padding: 3px 10px; border-radius: 999px; border: 1px solid #d6d1ff; background: var(--primary-soft); color: #3a2fa8; }
.lb-tag.reviews { background: transparent; border-style: dashed; }
.lb-tag.minus { color: #b42318; border-color: #f3c1c1; background: #fdeeee; }
.lb-tag.editable { cursor: pointer; }
.lb-tag.off { text-decoration: line-through; opacity: .45; }

.lb-kv { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0; border-bottom: 1px solid var(--border); font-size: 14px; }
.lb-kv:last-child { border-bottom: 0; }
.lb-kv span { color: var(--muted); }
.lb-kv b { font-weight: 600; text-align: right; overflow-wrap: anywhere; }
.lb-kv a { color: var(--primary); }

.lb-checks { list-style: none; padding: 0; margin: 0 0 14px; display: flex; flex-direction: column; gap: 8px; }
.lb-checks li { display: flex; gap: 8px; font-size: 13.5px; line-height: 1.4; }
.lb-checks svg { width: 17px; height: 17px; flex-shrink: 0; margin-top: 1px; }
.lb-checks li.ok svg { color: var(--green); stroke-width: 2.6; }
.lb-checks li.warn { color: #7a4d00; }
.lb-checks li.warn svg { color: #d99a00; }
.lb-decision { border-top: 4px solid #f2b33d; }
.lb-decision.approved { border-top-color: var(--green); }
.lb-decision.rejected { border-top-color: #c3c7d1; }
.lb-decision .check { margin-top: 10px; }
.lb-notes { margin: 0; padding-left: 18px; font-size: 13.5px; line-height: 1.5; color: #3d4454; }

/* settings drawer */
.drawer-backdrop { position: fixed; inset: 0; background: rgba(15,20,35,.35); z-index: 90; display: flex; justify-content: flex-end; }
.drawer-backdrop[hidden] { display: none; }
.drawer { width: min(440px, 100vw); height: 100%; background: #fff; overflow-y: auto; padding: 22px 24px; box-shadow: -10px 0 40px rgba(0,0,0,.15); }
.drawer-head { display: flex; justify-content: space-between; align-items: center; }
.drawer-head h2 { margin: 0; font-size: 20px; }
.drawer h4 { margin: 10px 0 0; font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.toggle { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; font-size: 14px; }
.toggle input { display: none; }
.toggle small { display: block; color: var(--muted); font-weight: 400; margin-top: 2px; }
.switch { width: 36px; height: 20px; border-radius: 10px; background: #d5d8e0; position: relative; flex-shrink: 0; transition: background .15s; margin-top: 1px; }
.switch::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: left .15s; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.toggle input:checked + .switch { background: var(--primary); }
.toggle input:checked + .switch::after { left: 18px; }

@media (max-width: 1100px) {
  .lb-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .lb-gallery { grid-template-columns: 1fr 1fr; }
  .lb-gallery.small { grid-template-columns: 1fr 1fr; }
  .lb-two, .lb-form { grid-template-columns: 1fr; }
}

/* Collection Creator */
.cc-find { padding: 18px 20px; }
.cc-search { display: flex; align-items: center; gap: 12px; border: 1.5px solid #d5d8e0; border-radius: 14px; padding: 6px 6px 6px 16px; background: #fff; }
.cc-search:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.cc-search > svg { color: var(--primary); width: 22px; height: 22px; }
.cc-search input { flex: 1; border: 0; outline: 0; font: inherit; font-size: 17px; min-width: 0; background: transparent; }
.cc-suggest { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 14px; font-size: 14px; }
.cc-suggest .chip { padding: 5px 12px; font-size: 13.5px; }
.cc-title { flex: 1; min-width: 0; }
.cc-title label { font-size: 12.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.cc-title-row { display: flex; align-items: center; gap: 12px; }
.cc-name-input { font: inherit; font-size: 24px; font-weight: 800; border: 0; border-bottom: 2px dashed #d5d8e0; padding: 2px 0; outline: 0; min-width: 0; width: min(100%, 420px); background: transparent; color: var(--text); }
.cc-name-input:focus { border-bottom-color: var(--primary); }
.cc-reading { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 13.5px; padding: 12px 14px; background: #f7f8fb; border-radius: 10px; }
.cc-read { background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: 4px 10px; color: var(--muted); }
.cc-read b { color: var(--text); margin-right: 2px; }
.cc-count { margin: 16px 0 12px; }
.cc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.cc-card { border: 1.5px solid var(--border); border-radius: 12px; overflow: hidden; cursor: pointer; background: #fff; transition: border-color .15s, opacity .15s, box-shadow .15s; opacity: .55; }
.cc-card:hover { border-color: #b9b2fb; opacity: .85; }
.cc-card.on { border-color: var(--primary); opacity: 1; box-shadow: 0 0 0 2px var(--primary-soft); }
.cc-card:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.cc-img { position: relative; aspect-ratio: 16 / 9; background: #f1f2f6; }
.cc-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cc-tick { position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.9); border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.25); color: var(--primary); display: grid; place-items: center; }
.cc-tick svg { width: 26px; height: 26px; }
.cc-body { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 4px; }
.cc-name { font-weight: 800; font-size: 15.5px; }
.cc-body .lb-addr { max-width: none; }
.cc-score { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 700; color: var(--primary); margin-top: 6px; }
.cc-bar { flex: 1; height: 5px; background: #eef0f5; border-radius: 3px; overflow: hidden; }
.cc-bar i { display: block; height: 100%; background: var(--primary); }
.cc-reasons { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.cc-reasons .lb-tag { font-size: 12px; padding: 2px 8px; }
.cc-add { margin-top: 18px; }
.cc-add select { width: auto; flex: 1; max-width: 420px; }
.cc-footer { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border); font-size: 14.5px; }
.cc-footer .muted { font-size: 13px; margin-top: 2px; max-width: 60ch; }
.cc-list-head { padding: 18px 22px 0; }
a.lb-tag { text-decoration: none; display: inline-block; margin: 2px 0; }

/* Restaurant Profiles */
.pf-colls { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.pf-colls.big { margin-top: 12px; }
.pf-coll {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; text-decoration: none;
  background: var(--primary); color: #fff; font-weight: 700; font-size: 13.5px;
}
.pf-coll svg { width: 15px; height: 15px; }
.pf-coll:hover { background: #4a3be0; }
.pf-coll.small { padding: 2px 9px; font-size: 12px; background: var(--primary-soft); color: var(--primary); }
.pf-coll.small svg { width: 12px; height: 12px; }
.pf-gallery { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 190px 190px; gap: 8px; border-radius: 16px; overflow: hidden; margin-bottom: 20px; }
.pf-gallery img, .pf-gallery .pf-hero { width: 100%; height: 100%; object-fit: cover; display: block; background: #f1f2f6; }
.pf-gallery .pf-hero { grid-row: span 2; }
.pf-gallery.single { grid-template-columns: 1fr; grid-template-rows: 380px; }
.pf-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.pf-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 8px 0 4px; font-size: 15px; }
.pf-meta > span + span::before { content: '·'; margin-right: 18px; color: #b3b7c2; }
.pf-h4 { margin: 14px 0 6px; font-size: 14px; }
.pf-list { margin: 0; padding-left: 18px; font-size: 14.5px; line-height: 1.6; }
.pf-contact { display: flex; align-items: center; gap: 10px; padding: 9px 0; color: var(--primary); text-decoration: none; font-weight: 600; font-size: 14.5px; border-bottom: 1px solid var(--border); }
.pf-contact:last-child { border-bottom: 0; }
.pf-contact svg { width: 18px; height: 18px; color: var(--muted); }
.lb-ok a { color: inherit; font-weight: 700; }
@media (max-width: 800px) {
  .pf-gallery { grid-template-columns: 1fr 1fr; grid-template-rows: 220px 120px 120px; }
  .pf-gallery .pf-hero { grid-column: span 2; grid-row: span 1; }
}

/* Tags */
.tg-table th, .tg-table td { padding: 18px 22px; }
.tg-table tr.tg-new td:first-child { box-shadow: inset 3px 0 0 var(--primary); }
.pager button { gap: 0; }
.tg-rest { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.tg-rest a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; text-decoration: none; color: var(--text); font-weight: 700; font-size: 14.5px; }
.tg-rest a:hover { border-color: var(--primary); color: var(--primary); }
.tg-rest a span { flex: 1; }
.tg-rest svg { width: 18px; height: 18px; color: var(--muted); }
.drawer .lb-kv { padding: 10px 0; }

/* Loyalty Programs */
.lp-table th, .lp-table td { padding: 16px 14px; }
.lp-table th { font-size: 14.5px; }
.lp-logo { width: 42px; height: 42px; border-radius: 6px; background: #f1f2f5; display: grid; place-items: center; color: #b3b7c2; }
.lp-logo svg { width: 22px; height: 22px; }
.lp-logo.brand { background: #7a1fd6; color: #fff; font-weight: 800; font-size: 10px; letter-spacing: -.2px; display: flex; align-items: center; justify-content: center; gap: 1px; }
.lp-type { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.lp-sub { font-size: 11.5px; font-weight: 700; color: #4b5bd6; background: #eef1ff; border: 1px solid #d5dbff; padding: 0 6px; border-radius: 6px; }
.lp-main { font-size: 15px; font-weight: 700; color: #7a1fd6; background: #f3e9ff; padding: 1px 10px; border-radius: 10px; }
.lp-name { max-width: 150px; }
.lp-name span { overflow-wrap: anywhere; }
.lp-wrap { max-width: 130px; overflow-wrap: anywhere; }
.lp-date { display: inline-block; max-width: 120px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
.lp-ops { display: inline-block; padding: 4px 10px; border-radius: 4px; font-weight: 700; font-size: 14.5px; }
.lp-ops.prod { background: #4cb58e; color: #fff; }
.lp-ops.test { background: #eceef2; color: #1c2230; }
.lp-dot { display: inline-block; width: 14px; height: 14px; border-radius: 50%; margin-left: 18px; }
.lp-dot.on { background: #3fbf6f; }
.lp-dot.off { background: #e5484d; }

/* Loyalty program page */
.pg-layout { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; align-items: start; }
.pg-back { display: flex; align-items: center; gap: 14px; margin: 8px 0 18px; }
.pg-back a { color: var(--text); display: grid; place-items: center; }
.pg-back svg { width: 24px; height: 24px; }
.pg-back h2 { margin: 0; font-size: 22px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pg-menu { padding: 0; overflow: hidden; }
.pg-menu a { display: flex; align-items: center; gap: 22px; padding: 16px 20px; color: var(--text); text-decoration: none; font-size: 16px; }
.pg-menu a svg { width: 22px; height: 22px; color: #5b6170; flex-shrink: 0; }
.pg-menu a:hover { background: #f7f8fb; }
.pg-menu a.on { background: #eeeff8; }
.pg-menu a.on svg { color: var(--primary); }
.pg-panel { padding: 22px; background: #fafbfc; min-width: 0; }
.pg-head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.pg-head h1 { margin: 0; font-size: 26px; font-weight: 800; }
.pg-note { font-size: 14px; margin: -6px 0 16px; max-width: 90ch; }
.pg-table td, .pg-table th { padding: 16px 14px; }
.pg-chev { display: inline-grid; place-items: center; transition: transform .15s; color: var(--muted); }
.pg-chev.open { transform: rotate(90deg); }
.pg-name { display: inline-block; max-width: 230px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
.pg-expand td { background: #fafaff; }
.pg-exp { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 24px; font-size: 14px; }
.pg-exp b { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin-bottom: 3px; }
.pg-exp .wide { grid-column: 1 / -1; }
.pg-exp .lb-link { display: flex; margin-top: 8px; }
.pg-details { max-width: 560px; }
.pg-seg { display: flex; width: fit-content; }
.pg-seg label { cursor: pointer; }
.pg-seg input { display: none; }
.pg-seg span { display: block; padding: 6px 14px; border-radius: 20px; font-weight: 700; color: var(--muted); }
.pg-seg input:checked + span { background: #fff; color: var(--primary); box-shadow: 0 1px 3px rgba(20,25,40,.12); }
.pg-affix { display: flex; align-items: center; gap: 8px; }
.pg-affix em { font-style: normal; color: var(--muted); font-weight: 700; min-width: 34px; }
.pg-dates { margin: 0; }
.pg-bulk { width: auto; padding: 6px 10px; font-size: 13.5px; }
.pg-discs { display: flex; flex-wrap: wrap; gap: 6px; }
.pg-disc { display: inline-flex; align-items: center; gap: 5px; padding: 3px 4px 3px 9px; border-radius: 999px; background: #e9f7ef; color: #1f7a4d; font-size: 12.5px; font-weight: 700; }
.pg-disc svg { width: 13px; height: 13px; }
.pg-disc.off { background: #f1f2f5; color: var(--muted); }
.pg-disc button { border: 0; background: transparent; color: inherit; padding: 0 2px; display: grid; place-items: center; opacity: .6; }
.pg-disc button:hover { opacity: 1; }
.pg-assign { min-width: 280px; max-height: 360px; overflow-y: auto; }
.pg-assign-head { font-size: 12.5px; font-weight: 700; color: var(--muted); padding: 6px 10px 8px; text-transform: uppercase; letter-spacing: .03em; }
.pg-assign label { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border-radius: 6px; cursor: pointer; }
.pg-assign label:hover { background: var(--bg); }
.pg-assign input { accent-color: var(--primary); margin-top: 3px; }
.pg-assign small { display: block; color: var(--muted); font-size: 12px; }
.pf-offer { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--border); font-size: 14px; }
.pf-offer:last-child { border-bottom: 0; }
.pf-offer svg { color: var(--green); width: 18px; height: 18px; margin-top: 2px; }
.pf-offer small { display: block; color: var(--muted); }
.pf-offer.off { opacity: .55; }
@media (max-width: 1000px) { .pg-layout { grid-template-columns: 1fr; } }
.pg-disc { white-space: nowrap; }
.pg-panel .lb-table .lb-addr { max-width: 260px; }
.pg-panel .lb-table .actions .btn { white-space: nowrap; }