/* HamSpace.club additions on top of Sam's main.css + Bootstrap 3 - same palette: black, #333 bar, #4CAF50 tab, #FFCC00 headings */
body { color: #fff; }
a { color: #FFCC00; }
a:hover, a:focus { color: #ffe066; }
.hs-logo { max-width: 100%; height: auto; padding: 6px 0 4px 6px; }
.hs-flash { margin: 0 15px 10px; padding: 8px 12px; background: #1d3b1f; border-left: 4px solid #4CAF50; color: #fff; font-size: 16px; }
.hs-error { margin: 0 15px 10px; padding: 8px 12px; background: #3b1d1d; border-left: 4px solid #e05050; color: #fff; font-size: 16px; }
.hs-form { margin: 10px 15px 25px; max-width: 520px; color: #fff; font-size: 16px; }
.hs-form.hs-wide { max-width: 900px; }
.hs-form label { display: block; margin: 0 0 12px; font-weight: normal; }
.hs-form small { color: #aaa; }
.hs-form input:not([type=checkbox]):not([type=file]), .hs-form select, .hs-form textarea {
  display: block; width: 100%; margin-top: 4px; padding: 7px 9px; color: #fff; background: #111; border: 1px solid #555; border-radius: 3px; font-size: 16px; }
.hs-form input:focus, .hs-form textarea:focus, .hs-form select:focus { outline: 2px solid #FFCC00; border-color: #FFCC00; }
.hs-form .hs-check { display: flex; gap: 8px; align-items: flex-start; }
.hs-btn { display: inline-block; padding: 7px 16px; background: #4CAF50; color: #fff !important; border: 0; border-radius: 3px; font-size: 15px; cursor: pointer; text-decoration: none !important; }
.hs-btn:hover { background: #43a047; }
.hs-btn-grey { background: #555; }
.hs-btn-grey:hover { background: #666; }
.hs-btn-sm { padding: 3px 8px; font-size: 12px; }
.hs-link { background: none; border: 0; color: #888; text-decoration: underline; cursor: pointer; font-size: 12px; padding: 0; }
.hs-inline { display: inline; }
.hs-post { border-top: 1px solid #333; padding-top: 8px; margin: 0 0 8px; }
.hs-post.hs-new { border-left: 4px solid #FFCC00; }
.hs-photo { border-radius: 50%; object-fit: cover; vertical-align: middle; }
.hs-emoji { line-height: 1; vertical-align: middle; }
.hs-on { color: #4CAF50; font-size: 12px; font-weight: bold; }
.hs-memorial { margin: 10px 15px; padding: 10px 0; border-top: 2px solid #FFCC00; border-bottom: 2px solid #FFCC00; }
.hs-memorial .auto-style15, .hs-memorial .auto-style2 { margin-left: 0; margin-right: 0; }
.hs-friends { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; margin: 0 15px; }
.hs-friend { display: flex; gap: 10px; align-items: center; padding: 8px; background: #111; border: 1px solid #333; border-radius: 6px; color: #fff; }
.hs-friend:hover { border-color: #FFCC00; text-decoration: none; color: #fff; }
.hs-friend small { color: #aaa; }
.hs-profile { margin: 0 15px; }
.hs-profile .auto-style15, .hs-profile .auto-style2 { margin-left: 0; }
.hs-admin .hs-form { max-width: none; }
.hs-table { margin: 0 15px 20px; width: calc(100% - 30px); color: #fff; font-size: 14px; border-collapse: collapse; }
.hs-table th, .hs-table td { padding: 5px 6px; border-bottom: 1px solid #333; vertical-align: top; }
.hs-table th { color: #FFCC00; text-align: left; }
.hs-table tr.hs-pending td { background: #2a2400; }
.hs-actions form { display: inline-block; margin: 0 4px 4px 0; }
.hs-actions select { color: #000; font-size: 12px; }

/* chat */
.hs-chat { margin: 0 10px; color: #fff; }
.hs-chat-head { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; margin-bottom: 6px; font-size: 15px; }
.hs-avbtn { font-size: 26px; line-height: 1; background: none; border: 1px solid #444; border-radius: 6px; cursor: pointer; padding: 2px 4px; }
.hs-tools { color: #aaa; font-size: 13px; }
.hs-chat-body { display: flex; gap: 8px; height: 60vh; min-height: 280px; resize: vertical; overflow: hidden; }
.hs-log { flex: 1; overflow-y: auto; background: #0b0b0b; border: 1px solid #333; border-radius: 4px; padding: 6px 8px; font-size: 15px; }
.hs-online { width: 190px; overflow-y: auto; background: #0b0b0b; border: 1px solid #333; border-radius: 4px; padding: 6px; font-size: 13px; }
.hs-online .hs-who { display: flex; align-items: center; gap: 5px; padding: 2px 0; }
.hs-online .hs-who button { margin-left: auto; font-size: 10px; background: #333; color: #ccc; border: 0; border-radius: 2px; padding: 1px 4px; cursor: pointer; }
.hs-msg { padding: 3px 0; word-wrap: break-word; overflow-wrap: anywhere; }
.hs-msg .hs-t { color: #666; font-size: 11px; margin-right: 4px; }
.hs-msg .hs-n { font-weight: bold; color: #FFCC00; }
.hs-msg .hs-n.hs-guest { color: #8fc3ff; }
.hs-msg .hs-del { margin-left: 6px; font-size: 10px; background: none; color: #777; border: 0; cursor: pointer; }
.hs-sys { color: #888; font-style: italic; font-size: 13px; }
.hs-emoji-bar { display: flex; flex-wrap: wrap; gap: 2px; margin: 6px 0; }
.hs-emoji-bar button { font-size: 20px; background: none; border: 0; cursor: pointer; padding: 0 2px; }
.hs-send { display: flex; gap: 6px; }
.hs-send input { flex: 1; padding: 8px 10px; font-size: 16px; color: #fff; background: #111; border: 1px solid #555; border-radius: 3px; }
.hs-send input:focus { outline: 2px solid #FFCC00; }
.hs-bandimg { margin: 6px 0; }
.hs-bandimg img { max-width: 100%; }
@media (max-width: 640px) {
  .hs-chat-body { flex-direction: column; height: 65vh; }
  .hs-online { width: auto; max-height: 70px; display: flex; flex-wrap: wrap; gap: 4px 10px; }
}
/* memorial */
.hs-sam .hs-fig { margin: 10px 15px; display: inline-block; vertical-align: top; max-width: calc(100% - 30px); }
.hs-sam .hs-fig img { max-width: 100%; height: auto; border: 1px solid #333; border-radius: 4px; display: block; }
.hs-sam figcaption { color: #aaa; font-size: 13px; margin-top: 4px; max-width: 400px; }
.hs-figs { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 6px; margin: 0 0 10px; }
.hs-figs .hs-fig { margin: 6px 15px; }
/* memorial tag beside the logo (Joe 11/01) */
.hs-brand { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 22px; padding-right: 60px; }
.hs-memorial-tag { display: flex; flex-direction: column; border-left: 3px solid #FFCC00; padding: 4px 0 4px 14px; text-decoration: none !important; line-height: 1.25; }
.hs-memorial-tag .hs-mt-1 { color: #ccc; font-size: 14px; letter-spacing: 1px; text-transform: uppercase; }
.hs-memorial-tag .hs-mt-2 { color: #FFCC00; font-size: 24px; font-weight: bold; }
.hs-memorial-tag .hs-mt-3 { color: #ccc; font-size: 13px; }
.hs-memorial-tag:hover .hs-mt-2 { color: #ffe066; text-decoration: underline; }
@media (max-width: 520px) {
  .hs-brand { padding-right: 56px; }
  .hs-memorial-tag { margin: 0 0 8px 8px; }
  .hs-memorial-tag .hs-mt-2 { font-size: 18px; }
}
.hs-sk-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; margin: 10px 15px 20px; }
.hs-sk { display: flex; gap: 12px; align-items: center; padding: 10px; background: #111; border: 1px solid #333; border-left: 3px solid #FFCC00; border-radius: 6px; color: #fff !important; font-size: 15px; }
.hs-sk img { width: 96px; height: 96px; object-fit: cover; border-radius: 4px; flex: none; }
.hs-sk small { color: #aaa; }
.hs-sk:hover { border-color: #FFCC00; text-decoration: none; }