/* LifeByLogic preferred source button v1 (October 10, 2026).
   "Add as a preferred source on Google" on every Learn article, twice: under
   the opening summary and after the last section. Black with Google's "G",
   Google blue on hover and focus. Linked last in the head of each Learn
   article; lbl-preferred-source.v1.js opens Google's own dialog, and the link
   opens Google's page in a new tab when the dialog is not ready. Served
   immutable: a change needs a new file name. */

.lbl-pref-source { margin: 2rem 0; }

/* Placed straight inside <main>, under a Quick answer box or between
   sections that sit in <main>: as wide as the box, with the same phone
   margins. */
.lbl-pref-source.lbl-pref-source--outer {
  box-sizing: border-box;
  width: calc(100% - 40px);
  max-width: var(--content-width, 760px);
  margin: 1.5rem auto 0;
}

/* The doubled class outranks article link rules such as
   .career-article a:not(.career-button):not(.career-card). */
.lbl-pref-source.lbl-pref-source a.lbl-pref-source__btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  box-sizing: border-box;
  max-width: 100%;
  min-height: 48px;
  padding: 8px 20px 8px 8px;
  border: 1px solid #5f6368;
  border-radius: 999px;
  background: #000;
  color: #fff;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  font-style: normal;
  line-height: 1.3;
  letter-spacing: normal;
  text-align: left;
  text-decoration: none;
  text-transform: none;
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease;
}

.lbl-pref-source.lbl-pref-source a.lbl-pref-source__btn:hover,
.lbl-pref-source.lbl-pref-source a.lbl-pref-source__btn:focus-visible {
  background: #1a73e8;
  border-color: #1a73e8;
  color: #fff;
  text-decoration: none;
}

.lbl-pref-source.lbl-pref-source a.lbl-pref-source__btn:focus-visible {
  outline: 2px solid #8ab4f8;
  outline-offset: 3px;
}

/* Google's four-colour "G" on a white disc, so it reads on black and on blue. */
.lbl-pref-source .lbl-pref-source__g {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%23EA4335' d='M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z'/%3E%3Cpath fill='%234285F4' d='M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z'/%3E%3Cpath fill='%23FBBC05' d='M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z'/%3E%3Cpath fill='%2334A853' d='M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
}

/* Narrow phones: a little smaller, so the label keeps to one line where it can. */
@media (max-width: 420px) {
  .lbl-pref-source.lbl-pref-source a.lbl-pref-source__btn { gap: 10px; padding-right: 16px; font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .lbl-pref-source.lbl-pref-source a.lbl-pref-source__btn { transition: none; }
}

@media print {
  .lbl-pref-source { display: none; }
}