/* Please Help — header skin ONLY.
 *
 * Loaded after style.css and only when the host is pleasehelp.uk. It changes
 * the top bar and nothing else: the dashboard, admin, cards, buttons, tables
 * and layout all stay exactly as ScanTags styles them.
 *
 * Deliberately does NOT re-point the palette variables. Doing that recoloured
 * every button and link across the whole app, which was not the ask.
 */

/* Navy bar, and the REVERSED lockup — the standard logo is navy artwork and
   is invisible against a navy background. */
.app-nav{
  background: #0B2D5C;
  border-bottom-color: rgba(255, 255, 255, .12);
}
.app-logo .dot{ display: none; }
.app-logo img{
  height: 42px; width: auto; display: block;
}
@media (max-width: 559px){
  .app-logo img{ height: 34px; }
}

/* Header contents need to read against the navy. */
.app-nav-links a{ color: rgba(255, 255, 255, .92); }
.app-nav-links a:hover{ color: #fff; }
.app-nav-user{ color: rgba(255, 255, 255, .62); }
.app-nav .btn-ghost{
  color: #fff;
  border-color: rgba(255, 255, 255, .38);
  background: transparent;
}
.app-nav .btn-ghost:hover{
  background: rgba(255, 255, 255, .12);
  border-color: #fff;
  color: #fff;
}

/* ---------- public tag page (the finder's view) ---------- */
/* The wordmark-and-dot is replaced by the real lockup, so the dot goes and the
   header becomes an image row. */
.pv-brand{ padding-block: 4px 2px; }
.pv-brand img{ height: 40px; width: auto; margin-inline: auto; display: block; }
.pv-brand-dot{ display: none; }

/* The type header was ScanTags green. On Please Help it is brand navy — set
   with !important because tag.php writes the tag-type colour as an inline
   style, which no ordinary selector can outrank. */
.pv-head{ background: #0B2D5C !important; }

/* Primary actions to match. */
.pv-wrap .btn-primary{
  background: #0B2D5C; border-color: #0B2D5C; color: #fff;
}
.pv-wrap .btn-primary:hover{ background: #12386E; border-color: #12386E; }
/* Scoped with :not() — a blanket `.pv-wrap a` rule was repainting the Call and
   WhatsApp action buttons navy-on-green, i.e. the two controls a finder needs
   most were the least readable on the page. Buttons keep their own colours. */
.pv-wrap a:not(.btn):not(.pv-btn):not(.pv-action){ color: #2F6099; }

/* Finder action buttons, set per button rather than in bulk.
   A blanket "all buttons white" rule caught .btn-loc, which has a WHITE
   background — so "Share my location" went white-on-white and vanished. Each
   button now gets the colour its own background actually needs. */
.pv-wrap .btn-contact,
.pv-wrap .btn-contact.btn-wa,
.pv-wrap .btn-contact:hover,
.pv-wrap .btn-contact.btn-wa:hover{ color: #fff; }

.pv-wrap .btn.btn-primary,
.pv-wrap .btn.btn-primary:hover{ color: #fff; }

/* Light-background buttons keep dark text. */
.pv-wrap .btn-loc,
.pv-wrap .btn-loc:hover,
.pv-wrap .btn-ghost,
.pv-wrap .btn-ghost:hover{ color: #0B2D5C; }

/* ---------- dashboard: primary actions in brand navy ---------- */
/* A green primary button is the odd one out on an otherwise navy product,
   wherever it appears — not just on the claim screen. */
.btn-primary{ background: #0B2D5C; border-color: #0B2D5C; color: #fff; }
.btn-primary:hover{ background: #12386E; border-color: #12386E; color: #fff; }

/* Breathing room between the action and the way back out of it. */
.claim-back{ margin-top: 20px; }

/* The primary button carried a hardcoded green glow —
   box-shadow: 0 6px 20px rgba(0,184,148,.28) — which survived the colour change
   because it is an rgba literal, not a variable. Replaced with a navy one. */
.btn-primary{ box-shadow: 0 6px 20px rgba(11, 45, 92, .26); }
.btn-primary:hover{ box-shadow: 0 8px 24px rgba(11, 45, 92, .32); }

/* Breathing room under the main action on the finder's page. */
.pv-wrap .btn-lg + .muted{ margin-top: 20px; }

/* The lockup was sitting small and tight. Give it room and size. */
.pv-brand{ padding-block: 10px 6px; margin-bottom: 6px; }
.pv-brand img{ height: 52px; }
@media (max-width: 420px){ .pv-brand img{ height: 44px; } }

/* Centre the type header — the emoji and the title read as one unit rather
   than hanging off the left edge of the bar. */
.pv-head{ justify-content: center; text-align: center; }

/* The lockup is 3.8:1. Constrain it by WIDTH, not height: at a fixed height a
   narrow container squeezes it and the mark rides into the wordmark. */
.pv-brand{ justify-content: center; }
.pv-brand img{ height: auto; width: 210px; max-width: 72%; }
@media (max-width: 420px){ .pv-brand img{ width: 180px; } }

/* Finder form: stack the name and contact fields into one column.
   Side by side, each field is too narrow to show its own placeholder — "Your
   phone number (" was being cut off mid-word — and a stranger helping someone
   in the street should be reading down one column, not across two. */
.pv-wrap .pv-found-row{ flex-direction: column; gap: 10px; }

/* ---------- the last of the ScanTags green ---------- */
/* Please Help is navy and blue and contains no green anywhere. Three finder-facing
   elements were still inheriting ScanTags' #00B894: the "leave your number" note,
   the location-shared status, and the emergency phone-number link — which rendered
   a bright green phone number in the middle of a navy page. Measured, not guessed:
   a colour probe over the live page found exactly these three and nothing else. */
.pv-wrap .pv-found-note,
.pv-wrap .pv-loc-status{
  background: rgba(11, 45, 92, .07);
  color: #0A2447;
}
.pv-wrap .pv-action{ color: #0B2D5C; }