/* Tyger Security helper widget. Colours from the site's CSS: orange #ce7123, dark grey #444 / #4b4c4d */
#tyh-root, #tyh-root * { box-sizing: border-box; }
#tyh-root { font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, sans-serif; font-size: 14px; line-height: 1.45; color: #222; }

#tyh-launcher {
  position: fixed; right: 20px; bottom: 20px; z-index: 99998;
  width: 60px; height: 60px; border-radius: 50%; border: 3px solid #fff;
  background: #ce7123; color: #fff; cursor: pointer; padding: 0;
  box-shadow: 0 3px 10px rgba(0,0,0,.35);
}
#tyh-launcher:hover, #tyh-launcher:focus { background: #b8601a; outline: none; }
#tyh-launcher svg { width: 34px; height: 34px; display: block; margin: 0 auto; fill: #fff; }

#tyh-bubble {
  position: fixed; right: 20px; bottom: 92px; z-index: 99998; max-width: 250px;
  background: #fff; color: #222; border: 2px solid #ce7123; border-radius: 12px;
  padding: 10px 30px 10px 12px; box-shadow: 0 3px 12px rgba(0,0,0,.25); cursor: pointer; display: none;
}
#tyh-bubble:after { content: ""; position: absolute; right: 22px; bottom: -10px; border-width: 10px 10px 0 10px; border-style: solid; border-color: #ce7123 transparent transparent transparent; }
#tyh-bubble-close { position: absolute; top: 2px; right: 6px; border: 0; background: none; font-size: 18px; color: #777; cursor: pointer; padding: 2px 4px; }

#tyh-panel {
  position: fixed; right: 20px; bottom: 92px; z-index: 99999;
  width: 360px; height: 540px; max-height: calc(100% - 110px);
  background: #fff; border-radius: 12px; overflow: hidden; display: none;
  box-shadow: 0 6px 24px rgba(0,0,0,.35); border: 1px solid #ccc;
  flex-direction: column;
}
#tyh-panel.tyh-open { display: block; display: flex; }
#tyh-head { background: #444; color: #fff; border-bottom: 4px solid #ce7123; padding: 12px 44px 12px 14px; position: relative; flex: 0 0 auto; }
#tyh-head strong { font-size: 16px; display: block; }
#tyh-head span { font-size: 12px; color: #ffca89; }
#tyh-close { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; border: 0; background: none; color: #fff; font-size: 22px; cursor: pointer; }
#tyh-msgs { flex: 1 1 auto; overflow-y: auto; padding: 12px; background: #f4f4f4; -webkit-overflow-scrolling: touch; height: 380px; }
#tyh-panel.tyh-open #tyh-msgs { height: auto; }
.tyh-msg { margin: 0 0 10px; padding: 9px 12px; border-radius: 10px; max-width: 90%; word-wrap: break-word; }
.tyh-msg p { margin: 0 0 8px; } .tyh-msg p:last-child { margin: 0; }
.tyh-bot { background: #fff; border: 1px solid #ddd; }
.tyh-user { background: #ce7123; color: #fff; margin-left: auto; text-align: right; }
.tyh-msg a { color: #b34700; } .tyh-user a { color: #fff; }
.tyh-chips { margin: 0 0 10px; }
.tyh-chip {
  display: inline-block; margin: 0 6px 6px 0; padding: 7px 11px; border-radius: 16px;
  border: 1px solid #ce7123; background: #fff; color: #b34700; cursor: pointer; font-size: 13px; text-align: left; font-family: inherit; text-decoration: none; line-height: 1.3;
}
.tyh-chip:hover, .tyh-chip:focus { background: #ce7123; color: #fff; outline: none; }
.tyh-chip.tyh-strong { background: #ce7123; color: #fff; }
.tyh-chip.tyh-strong:hover { background: #b8601a; }
.tyh-form label { display: block; font-size: 12px; color: #555; margin: 6px 0 2px; }
.tyh-form input, .tyh-form select, .tyh-form textarea { width: 100%; padding: 7px; border: 1px solid #bbb; border-radius: 6px; font: inherit; font-size: 14px; }
.tyh-form textarea { height: 60px; resize: vertical; }
.tyh-err { color: #b00; font-size: 12px; margin-top: 4px; }
#tyh-foot { flex: 0 0 auto; border-top: 1px solid #ddd; padding: 8px; background: #fff; }
#tyh-input-row { display: table; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; }
#tyh-input { display: table-cell; width: 100%; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; padding: 9px 10px; border: 1px solid #bbb; border-radius: 6px; font: inherit; font-size: 16px; }
#tyh-send { display: table-cell; margin-left: 6px; padding: 9px 14px; border: 0; border-radius: 6px; background: #444; color: #fff; cursor: pointer; font: inherit; white-space: nowrap; }
#tyh-send:hover { background: #222; }
#tyh-links { font-size: 12px; color: #666; margin-top: 6px; text-align: center; }
#tyh-links a { color: #b34700; }

@media (max-width: 480px) {
  #tyh-panel { right: 0; bottom: 0; left: 0; top: 0; width: 100%; height: 100%; max-height: none; border-radius: 0; border: 0; }
  #tyh-launcher { right: 14px; bottom: 14px; }
  #tyh-bubble { right: 14px; bottom: 84px; max-width: 75%; }
}
@media print { #tyh-root { display: none; } }

/* Always-visible handoff to a person */
#tyh-handoff { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 8px; }
#tyh-handoff a, #tyh-handoff button {
  -webkit-box-flex: 1; -ms-flex: 1 1 40%; flex: 1 1 40%; display: block; text-align: center; padding: 9px 6px;
  border-radius: 6px; font: inherit; font-size: 13px; font-weight: bold; text-decoration: none; cursor: pointer; line-height: 1.3;
}
#tyh-call { background: #ce7123; color: #fff; border: 1px solid #ce7123; margin-right: 6px; }
#tyh-call:hover, #tyh-call:focus { background: #b8601a; }
#tyh-msg-btn { background: #fff; color: #b34700; border: 1px solid #ce7123; }
#tyh-msg-btn:hover, #tyh-msg-btn:focus { background: #fff3e8; }

/* Gentle pulse on mobile until the helper has been opened once */
@-webkit-keyframes tyh-pulse {
  0%   { -webkit-transform: scale(1);    box-shadow: 0 3px 10px rgba(0,0,0,.35), 0 0 0 0 rgba(206,113,35,.75); }
  50%  { -webkit-transform: scale(1.06); box-shadow: 0 3px 10px rgba(0,0,0,.35), 0 0 0 14px rgba(206,113,35,0); }
  100% { -webkit-transform: scale(1);    box-shadow: 0 3px 10px rgba(0,0,0,.35), 0 0 0 0 rgba(206,113,35,0); }
}
@keyframes tyh-pulse {
  0%   { transform: scale(1);    box-shadow: 0 3px 10px rgba(0,0,0,.35), 0 0 0 0 rgba(206,113,35,.75); }
  50%  { transform: scale(1.06); box-shadow: 0 3px 10px rgba(0,0,0,.35), 0 0 0 14px rgba(206,113,35,0); }
  100% { transform: scale(1);    box-shadow: 0 3px 10px rgba(0,0,0,.35), 0 0 0 0 rgba(206,113,35,0); }
}
@media (max-width: 768px) {
  #tyh-launcher:not(.tyh-used) { -webkit-animation: tyh-pulse 2s ease-out infinite; animation: tyh-pulse 2s ease-out infinite; }
}
@media (prefers-reduced-motion: reduce) {
  #tyh-launcher, #tyh-launcher:not(.tyh-used) { -webkit-animation: none !important; animation: none !important; }
}

#tyh-book { -ms-flex: 1 1 100% !important; flex: 1 1 100% !important; margin-top: 6px; background: #444; color: #fff; border: 1px solid #444; }
#tyh-book:hover, #tyh-book:focus { background: #222; }