/* ==========================================================================
   Tool access gate notice
   --------------------------------------------------------------------------
   Loaded only for logged-out visitors on a member-only tool, alongside
   assets/js/asire-tool-gate.js. Its own file rather than an addition to the
   per-tool stylesheets, because .mt-tool-section is declared in a dozen of
   them and this would have had to be pasted into every one.
   ========================================================================== */

/* Not flex: with flex-wrap each text node and each link becomes its own flex
   item, so the sentence breaks into a stack of fragments. A plain centred
   block keeps it as one sentence that wraps normally. */
.mt-tool-gate-note{
  max-width:760px;
  margin:0 auto 24px;
  padding:12px 18px;

  background:#eef4fc;
  border:1px solid #9ABAE0;
  border-radius:10px;

  font-size:14.5px;
  line-height:1.5;
  color:#0b1626;
  text-align:center;
}

.mt-tool-gate-note svg{
  display:inline-block;
  vertical-align:-3px;
  margin-right:7px;
  color:#0A49A6;
}

.mt-tool-gate-note a{
  color:#0A49A6;
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:2px;
}
.mt-tool-gate-note a:hover{color:#073a86;}

@media (max-width:520px){
  .mt-tool-gate-note{
    margin-bottom:18px;
    padding:11px 14px;
    font-size:13.5px;
  }
}

/* The page still prints as a description of the tool; the sign-in nudge is
   only meaningful on screen. */
@media print{
  .mt-tool-gate-note{display:none;}
}