/* Phase 2 screens: shops directory, alerts, dialogs, toasts, assistant cards. Same glass/glow language. */
.sec-h { margin: 0; font-size: 18px; font-weight: 500; color: var(--ink); }
.shops-shell, .shop-detail { margin-top: 40px; }
.shop-filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 6px 0 4px; }
.shop-filters input, .shop-filters select, .dlg select, .dlg textarea, #alNote {
  height: 44px; border-radius: 12px; border: 1px solid var(--line-2); background: rgba(0, 0, 0, .3); padding: 0 14px; font-size: 14px; color: var(--ink); font-family: inherit; }
.shop-filters input { flex: 1; min-width: 200px; }
.shop-filters select { min-width: 160px; }
.dlg textarea { height: auto; padding: 10px 14px; resize: vertical; width: 100%; line-height: 1.6; }
select option { background: #0B0F15; }
.shop-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; margin-top: 10px; }
.shop-list > p { grid-column: 1 / -1; margin: 0; }
.shop-card { border-radius: 16px; border: 1px solid var(--line-2); background: rgba(255, 255, 255, .025); padding: 16px; display: flex; flex-direction: column; gap: 8px; transition: border-color .2s, transform .2s; }
.shop-card:hover { border-color: rgba(207, 242, 230, .3); transform: translateY(-2px); }
.shop-card header { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.shop-name { font-size: 16px; font-weight: 500; color: var(--ink); }
.shop-name:hover { color: var(--mint); }
.shop-where { color: var(--ink-2); font-size: 13px; }
.shop-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.shop-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.shop-actions .btn { height: 30px; padding: 0 12px; font-size: 12.5px; }
.shop-meta { font-size: 11.5px; color: var(--ink-3); }
.badge.muted-badge { background: rgba(255, 255, 255, .04); border-color: var(--line-2); color: var(--ink-3); }
.badge.conf-high { color: var(--mint); }
.badge.conf-medium { color: #C9D7F5; background: rgba(120, 140, 200, .12); border-color: rgba(160, 180, 230, .35); }
.badge.conf-low { color: #F6CF8C; background: rgba(240, 182, 90, .1); border-color: rgba(240, 182, 90, .4); }
.shop-detail .shop-where { font-size: 15px; margin-bottom: 8px; }
.shop-dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 18px; margin: 16px 0; font-size: 14px; }
.shop-dl dt { color: var(--ink-3); } .shop-dl dd { margin: 0; }
.shop-dl a { color: var(--mint); }
.sources { margin-top: 14px; font-size: 12.5px; color: var(--ink-2); }
.sources summary { cursor: pointer; }
.sources ul { margin: 8px 0 0; padding-inline-start: 18px; display: flex; flex-direction: column; gap: 4px; word-break: break-all; }
.sources a { color: var(--ink-2); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .2); }

/* alerts */
.alerts-grid { display: grid; grid-template-columns: minmax(300px, 420px) minmax(0, 1fr); gap: 18px; margin-top: 40px; align-items: start; }
#alForm { display: flex; flex-direction: column; gap: 14px; }
#alForm.pulse { box-shadow: var(--shadow-in), 0 0 0 2px rgba(16, 188, 131, .6), 0 0 40px rgba(16, 188, 131, .35); transition: box-shadow .3s; }
.row-input { display: flex; gap: 8px; align-items: center; }
.row-input input { flex: 1; height: 46px; border-radius: 12px; border: 1px solid var(--line-2); background: rgba(0, 0, 0, .25); padding: 0 14px; font-size: 16px; color: var(--ink); }
.warn { color: #F6CF8C; }
#alTabs { margin: 4px 0 12px; }
.al-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.al-list > li.muted { padding: 18px 4px; }
.al-item { display: flex; justify-content: space-between; gap: 12px; align-items: center; flex-wrap: wrap; border-radius: 14px; border: 1px solid var(--line-2); padding: 12px 14px; background: rgba(255, 255, 255, .02); }
.al-item.st-triggered { border-color: rgba(16, 188, 131, .45); background: rgba(16, 188, 131, .06); }
.al-item.st-paused { opacity: .7; }
.al-title { font-size: 15px; }
.al-hit { color: var(--mint); font-size: 13px; margin-top: 4px; }
.al-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.btn.danger:hover { border-color: rgba(242, 103, 107, .6); color: #F7A3A6; }

/* dialogs */
.dlg { border: 1px solid var(--line-2); border-radius: 20px; background: #0A0D13; color: var(--ink); padding: 22px; width: min(520px, calc(100vw - 32px));
  box-shadow: var(--shadow-in), 0 0 0 1px rgba(16, 188, 131, .15), 0 30px 80px -20px rgba(0, 0, 0, .9); }
.dlg::backdrop { background: rgba(2, 4, 8, .7); backdrop-filter: blur(4px); }
.dlg h3 { margin: 0 0 4px; font-weight: 500; font-size: 18px; }
.dlg .field { margin-top: 10px; }
.dlg .fgrid { margin: 8px 0 0; }

/* toasts + floating ask button */
.toasts { position: fixed; z-index: 80; inset-inline-end: 20px; bottom: 24px; display: flex; flex-direction: column; gap: 8px; max-width: min(380px, calc(100vw - 40px)); }
.toast { padding: 12px 16px; border-radius: 14px; background: rgba(12, 16, 22, .96); border: 1px solid var(--line-2); font-size: 13.5px; box-shadow: 0 20px 50px -10px rgba(0, 0, 0, .8); animation: toastIn .3s ease both; transition: opacity .5s, transform .5s; }
.toast.hit { border-color: rgba(16, 188, 131, .6); box-shadow: 0 0 30px rgba(16, 188, 131, .3); }
.toast.out { opacity: 0; transform: translateY(8px); }
@keyframes toastIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.fab { display: none; }

/* assistant cards */
.acard-list { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.acard-list a { color: var(--ink); text-decoration: underline; text-decoration-color: rgba(207, 242, 230, .3); }
.acard.topic h4 { margin: 6px 0 6px; font-size: 16px; font-weight: 500; }
.topic-body { margin: 0; padding-inline-start: 18px; display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; color: var(--ink-2); }
.sugg.inline { padding: 10px 0 0; }

@media (max-width: 900px) {
  .alerts-grid { grid-template-columns: minmax(0, 1fr); margin-top: 24px; }
  .row-input input { min-width: 0; }
  .shops-shell, .shop-detail { margin-top: 24px; }
  .shop-list { grid-template-columns: 1fr; }
  .tabbar { grid-template-columns: repeat(5, 1fr); }
  .fab { display: grid; place-items: center; position: fixed; z-index: 45; inset-inline-end: 18px; bottom: calc(92px + env(safe-area-inset-bottom)); width: 54px; height: 54px; border-radius: 50%; border: 0; cursor: pointer;
    background: #F2FFFA; color: var(--bg); box-shadow: 0 0 0 1px rgba(207, 242, 230, .55), 0 0 26px 3px rgba(0, 179, 140, .55); }
  .fab svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
  .toasts { bottom: calc(160px + env(safe-area-inset-bottom)); inset-inline: 16px; max-width: none; }
}
.foot a { color: var(--ink-2); text-decoration: underline; text-decoration-color: rgba(255,255,255,.2); }

/* phone: the assistant sheet owns the bottom of the screen while open */
@media (max-width: 900px) {
  body.asst-open .tabbar, body.asst-open .fab { display: none; }
}
