/* ============================================================================
   townsquare - THE SHORT-PROFILE WINDOW (#profModal, partials/profile_window.php,
   js/profile_window.js) and the pieces it shares with the business directory
   cards: the round avatar (.tq-pav) and the badges. Loaded on every Townsquare
   page (theme.json vendors.global): the directory, the feed, a post and the
   inner pages all open the same window. ts-profile-window.
   ============================================================================ */

/* ---------- the avatar and the badges ---------- */
.tq-pav{position:relative;z-index:2;width:92px;height:92px;margin-top:-46px;border-radius:50%;border:5px solid #fff;display:grid;place-items:center;overflow:hidden;font:800 28px var(--tq-body);color:#fff;box-shadow:0 12px 24px -12px rgba(8,15,84,.5);cursor:pointer;transition:transform .3s;padding:0;background:var(--tq-blue)}
.tq-pav img{width:100%;height:100%;object-fit:cover}
.tq-pav:hover{transform:scale(1.05)}
.tq-pav.tq-sm{flex:0 0 44px;width:44px;height:44px;margin:0;border-width:3px;font-size:15px!important;padding:0!important;border-radius:50%!important;cursor:default}
.tq-pav.tq-big{width:110px;height:110px;margin-top:-58px;font-size:34px;cursor:default}
.tq-pav-0{background:linear-gradient(135deg,#1326F3,#6A5CFF)}
.tq-pav-1{background:linear-gradient(135deg,#FF8A3D,#E0457B)}
.tq-pav-2{background:linear-gradient(135deg,#0FA7BA,#1326F3)}
.tq-pav-3{background:linear-gradient(135deg,#FAE621,#FFB800);color:var(--tq-navy)}
.tq-pav-4{background:linear-gradient(135deg,#5A3FF0,#E0457B)}
.tq-pav-5{background:linear-gradient(135deg,#0E8F6E,#0FA7BA)}
.tq-badges{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin:10px 0 6px}
.tq-bdg{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--b);color:#fff;font-style:normal;box-shadow:0 6px 12px -6px var(--b)}

/* ---------- the organization and place lines (a card, the window) ---------- */
.tq-porg{margin:0;font:700 15px var(--tq-body);color:var(--tq-blue);overflow-wrap:anywhere}
.tq-ploc2{display:inline-flex;align-items:center;gap:5px;margin:4px 0 0;font-size:14px;color:var(--tq-soft)}
.tq-ploc2 svg{flex:0 0 auto;color:var(--tq-blue)}

/* ---------- the profile window ---------- */
.tq-pmodal{width:min(620px,100%)}
.tq-pm-cover{position:relative;height:150px;background:#E8EBFF;overflow:hidden}
.tq-pm-cover img{width:100%;height:100%;object-fit:cover}
.tq-pm-cover .tq-mx{background:rgba(8,15,84,.45);z-index:2}
.tq-pm-body{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 26px 24px}
.tq-pm-body h3{font:800 24px/1.2 var(--tq-body);color:#0B1A4A;margin:4px 0 2px;overflow-wrap:anywhere}
.tq-pm-about{margin:14px 0 0;color:var(--tq-soft);font-size:15px;max-width:52ch}
.tq-pm-sv{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:14px}
.tq-pm-sv span{padding:6px 11px;border-radius:999px;background:#EEF0FF;color:#1B2A8C;font:700 14px var(--tq-body)}
.tq-pm-stats{display:flex;gap:8px;width:100%;margin-top:16px}
.tq-pm-stats span[hidden],.tq-pm-body [hidden]{display:none}
.tq-pm-todo{margin:12px 0 0;padding:8px 14px;border-radius:999px;background:#F1F3FF;color:var(--tq-muted);font:600 14px var(--tq-body)}
.tq-pm-stats span{flex:1 1 0;min-width:0;padding:10px;border-radius:14px;background:#F6F7FF;font-size:14px;color:var(--tq-muted)}
.tq-pm-stats b{display:block;font:800 20px var(--tq-body);color:var(--tq-navy);font-variant-numeric:tabular-nums}
.tq-pm-act{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:18px}
.tq-pm-act .tq-btn-blue,.tq-pm-act .tq-btn-line{padding:11px 18px;font-size:14px;text-decoration:none}
@media (max-width:520px){.tq-pm-body{padding:0 16px 20px}.tq-pm-stats{gap:6px}.tq-pm-stats b{font-size:17px}}
/* while the profile is fetched (a feed author): the window, a line, nothing else */
.tq-pm-wait{margin:22px 0 4px;font:600 15px var(--tq-body);color:var(--tq-muted)}
#profModal.tq-pm-busy .tq-pm-body>:not(.tq-pm-wait){display:none}
#profModal:not(.tq-pm-busy) .tq-pm-wait{display:none}
.tq-pm-act a[target="_blank"]{white-space:nowrap}
/* View Full Profile on a profile still in progress: greyed, goes nowhere */
.tq-pm-act .tq-btn-line.tq-pm-off{border-color:var(--tq-line);color:var(--tq-muted);background:#F1F3F8;cursor:not-allowed;box-shadow:none;transform:none}
