/* =========================================================
   LOCARTA BADGES: compact icon + label, LOCARTA palette only.
   Used by mobile.html, tourist.html and artist.html.
   ========================================================= */
.lb-row { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px; max-width: 100%; vertical-align: middle; }
.lb {
  position: relative; display: inline-flex; align-items: center; gap: 4px; max-width: 100%;
  border: 1px solid; border-radius: 7px; font-family: inherit; font-weight: 700; line-height: 1;
  white-space: nowrap; cursor: default; -webkit-tap-highlight-color: transparent;
}
.lb svg { flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lb-t { overflow: hidden; text-overflow: ellipsis; }

/* sizes: sm for cards and lists, md for profiles and detail pages */
.lb-sm { height: 20px; padding: 0 7px 0 5px; font-size: 10.5px; letter-spacing: .01em; }
.lb-sm svg { width: 12px; height: 12px; }
.lb-md { height: 26px; padding: 0 10px 0 7px; font-size: 12.5px; }
.lb-md svg { width: 15px; height: 15px; }

/* colour families (text contrast ≥ 4.5:1 on each background) */
.lb-trust { background: #F3EAE0; border-color: #E2CDB4; color: #5A2810; }
.lb-recognition { background: #F8ECD6; border-color: #EAD2A8; color: #7A4F10; }
.lb-culture { background: #F7E5D8; border-color: #EAC7B2; color: #8A3519; }
.lb-more { background: #fff; border-color: #E8DED0; color: #5E4A3C; padding: 0 7px; }

/* the explanation: hover (mouse) or focus/tap (keyboard, touch) */
.lb[data-tip]::after {
  content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 8px); z-index: 60;
  width: max-content; max-width: 220px; padding: 7px 10px; border-radius: 10px;
  background: #2B1A10; color: #FFF8EE; font-size: 11.5px; font-weight: 500; line-height: 1.35; white-space: normal; text-align: left;
  box-shadow: 0 8px 20px -8px rgba(43, 26, 16, .6);
  display: none; transform: translateX(-50%); pointer-events: none;
}
.lb[data-tip]::before {
  content: ""; position: absolute; left: 50%; bottom: calc(100% + 3px); z-index: 60; margin-left: -5px;
  border: 5px solid transparent; border-top-color: #2B1A10; border-bottom: 0;
  display: none;
}
@media (hover: hover) { .lb[data-tip]:hover::after, .lb[data-tip]:hover::before { display: block; animation: lbTip .15s ease-out; } }
.lb[data-tip]:focus::after, .lb[data-tip]:focus::before { display: block; animation: lbTip .15s ease-out; }
@keyframes lbTip { from { opacity: 0; } to { opacity: 1; } }
.lb:focus { outline: none; }
.lb:focus-visible { box-shadow: 0 0 0 2px #C8892C; }
@media (prefers-reduced-motion: reduce) { .lb[data-tip]::after, .lb[data-tip]::before { animation: none !important; } }