/* Marketplace look (10/21/2026): the approved mockups (deliverables/marketplace-mockups) on the site's Bootstrap 3
   grid. Lato body and Montserrat headings come from freelancer.css; everything here is prefixed tp-mp- so it never
   touches the rest of the site. Font Awesome 4 icons only. */

.tp-mp { color: #334155; }
.tp-mp a { color: #2d80d2; }
.tp-mp a:hover { color: #1d5fa3; }
.tp-mp h1, .tp-mp h2, .tp-mp h3, .tp-mp h4 { text-transform: none; letter-spacing: 0; color: #0f172a; margin-top: 0; }
.tp-mp h1 { font-size: 26px; font-weight: 700; margin-bottom: 6px; }
.tp-mp h2 { font-size: 19px; font-weight: 700; margin-bottom: 10px; }
.tp-mp h3 { font-size: 17px; font-weight: 700; margin-bottom: 6px; }
.tp-mp p { margin: 0 0 10px; }
.tp-mp .row { margin-left: -8px; margin-right: -8px; }
.tp-mp .row > [class*="col-"] { padding-left: 8px; padding-right: 8px; }

/* sub-nav under the site header */
.tp-mp-nav { background: #fff; border-bottom: 1px solid #e2e8f0; margin: 0 0 18px; }
.tp-mp-nav .tp-mp-nav-in { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 4px; padding: 6px 15px; }
.tp-mp-nav a { display: inline-block; padding: 8px 12px; font-size: 15px; font-weight: 600; color: #334155; border-radius: 6px; text-decoration: none; }
.tp-mp-nav a:hover, .tp-mp-nav a:focus { background: #f1f5f9; color: #2d80d2; text-decoration: none; }
.tp-mp-nav a.on { color: #198754; }
.tp-mp-nav .tp-mp-nav-right { margin-left: auto; display: flex; gap: 6px; align-items: center; }
.tp-mp-nav .tp-mp-beta { font-size: 10px; font-weight: 800; color: #0369a1; background: #e0f2fe; border: 1px solid #bae6fd; border-radius: 10px; padding: 1px 6px; vertical-align: middle; }
.tp-mp-status { margin: 0 15px 12px; padding: 10px 14px; border-radius: 8px; background: #d1fae5; border: 1px solid #a7f3d0; color: #047857; font-weight: 700; }

/* cards */
.tp-mp-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 18px 18px; box-shadow: 0 1px 3px rgba(0,0,0,.04); margin-bottom: 16px; }
.tp-mp-card.lift { transition: transform .2s ease, box-shadow .2s ease; }
.tp-mp-card.lift:hover { transform: translateY(-3px); box-shadow: 0 10px 20px rgba(0,0,0,.06); }
.tp-mp-card.top-teal { border-top: 4px solid #10b981; }
.tp-mp-card.ad { background: #fbfcfd; border-color: #cbd5e1; }
.tp-mp-card.info { background: #eff6ff; border-color: #bfdbfe; text-align: center; }
.tp-mp-card.info .big { font-weight: 700; color: #1e3a8a; margin-bottom: 10px; }
.tp-mp-label { font-size: 11.5px; color: #94a3b8; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; margin-bottom: 6px; }
.tp-mp-title { font-size: 17px; font-weight: 700; color: #0f172a; line-height: 1.3; margin: 0; }
a.tp-mp-title { color: #0f172a; }
a.tp-mp-title:hover { color: #2d80d2; text-decoration: none; }
.tp-mp-meta { font-size: 13.5px; color: #64748b; }
.tp-mp-meta .sep { margin: 0 5px; color: #cbd5e1; }
.tp-mp-meta a, .tp-mp-crumb a { font-size: inherit; }
.tp-mp-tags .more-tags { display: none; }
.tp-mp-tags.open .more-tags { display: inline; }
.tp-mp-tags .tp-mp-tag-toggle { font-size: 12.5px; margin-left: 4px; }
.tp-mp-muted { color: #64748b; }

/* badges and chips */
.tp-mp-badge { display: inline-block; font-size: 11px; font-weight: 700; padding: 2px 6px; border-radius: 4px; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; line-height: 1.4; vertical-align: middle; }
.tp-mp-badge.member { background: #d1fae5; color: #047857; border: 1px solid #a7f3d0; }
.tp-mp-badge.small { background: #fef3c7; color: #92400e; border: 1px solid #fde68a; }
.tp-mp-badge.partner { background: #ffedd5; color: #9a3412; border: 1px solid #fed7aa; }
.tp-mp-badge.plan { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; border-radius: 12px; padding: 2px 8px; }
.tp-mp-badge.ad { background: #f1f5f9; color: #475569; border: 1px solid #cbd5e1; }
.tp-mp-chip { display: inline-block; background: #fff; color: #334155; border: 1px solid #e2e8f0; font-size: 13px; padding: 4px 12px; border-radius: 50px; margin: 3px 4px 3px 0; text-decoration: none; line-height: 1.4; }
.tp-mp-chip:hover { text-decoration: none; border-color: #2d80d2; color: #2d80d2; }
.tp-mp-chip.on { background: #0f172a; color: #fff; border-color: #0f172a; }
.tp-mp-chip.on:hover { color: #fff; }
.tp-mp-naics { display: inline-block; background: #f1f5f9; color: #334155; font-weight: 700; font-size: 12.5px; padding: 2px 7px; border-radius: 4px; margin-right: 4px; }
.tp-mp-tag { display: inline-block; background: #f0f9ff; color: #0369a1; border: 1px solid #bae6fd; font-size: 11.5px; font-weight: 600; padding: 3px 8px; border-radius: 12px; margin: 2px 2px 2px 0; }

/* buttons */
.tp-mp .btn.tp-mp-btn { border-radius: 6px; font-weight: 600; font-size: 14px; padding: 8px 16px; text-shadow: none; box-shadow: none; text-transform: none; letter-spacing: 0; }
.tp-mp .btn.tp-mp-btn-teal { background: #10b981; border: 1px solid #10b981; color: #fff; }
.tp-mp .btn.tp-mp-btn-teal:hover, .tp-mp .btn.tp-mp-btn-teal:focus { background: #059669; border-color: #059669; color: #fff; }
.tp-mp .btn.tp-mp-btn-amber { background: #f59e0b; border: 1px solid #d97706; color: #fff; }
.tp-mp .btn.tp-mp-btn-amber:hover, .tp-mp .btn.tp-mp-btn-amber:focus { background: #d97706; color: #fff; }
.tp-mp .btn.tp-mp-btn-ghost { background: #fff; border: 1px solid #e2e8f0; color: #334155; }
.tp-mp .btn.tp-mp-btn-ghost:hover, .tp-mp .btn.tp-mp-btn-ghost:focus { border-color: #2d80d2; color: #2d80d2; background: #fff; }
.tp-mp .btn.tp-mp-btn-ghost.on { border-color: #2d80d2; color: #2d80d2; background: #eff6ff; }
.tp-mp .btn.tp-mp-btn-ghost[disabled], .tp-mp .btn.tp-mp-btn-ghost.disabled, .tp-mp .btn.tp-mp-btn.disabled { opacity: .55; cursor: not-allowed; }
.tp-mp .btn.tp-mp-btn-block { display: block; width: 100%; }
.tp-mp .btn.tp-mp-btn-sm { padding: 6px 12px; font-size: 13px; }
/* the create-post control renders its own New Post link plus two empty anchors that only serve as modal triggers;
   style the real button by its id and keep the empty anchors invisible */
.tp-mp-newpost a[id$="lnkCreatePost"] { display: inline-block !important; width: auto !important; background: #10b981; border: 1px solid #10b981; color: #fff !important; border-radius: 6px; font-weight: 600; font-size: 14px; padding: 8px 16px; text-decoration: none !important; }
.tp-mp-newpost a[id$="lnkCreatePost"]:hover { background: #059669; }
.tp-mp-newpost a:empty { display: none !important; }

/* hero (visitor home) */
.tp-mp-hero { background: linear-gradient(180deg, #ffffff 0%, #f1f5f9 100%); border: 1px solid #e2e8f0; border-radius: 10px; padding: 34px 28px 30px; margin-bottom: 20px; }
.tp-mp-hero h1 { font-size: 30px; margin: 8px 0 10px; }
.tp-mp-hero .lead { font-size: 17px; color: #64748b; margin-bottom: 16px; }
.tp-mp-price { font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 30px; font-weight: 700; color: #0f172a; }
.tp-mp-price small { font-size: 15px; color: #64748b; font-weight: 400; }
.tp-mp-checks { list-style: none; padding: 0; margin: 12px 0 0; }
.tp-mp-checks li { padding: 5px 0 5px 26px; position: relative; font-size: 14.5px; }
.tp-mp-checks li .fa { position: absolute; left: 0; top: 8px; color: #10b981; }
.tp-mp-steps { padding-left: 18px; margin: 0; font-size: 14.5px; }
.tp-mp-steps li { margin-bottom: 8px; }

/* member head */
.tp-mp-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 14px; }
.tp-mp-head h1 { margin: 0; font-size: 24px; }

/* section tiles */
.tp-mp-tiles { margin-bottom: 8px; }
.tp-mp-tile { display: block; border: 1px solid #e2e8f0; border-radius: 10px; padding: 16px; background: #fff; color: #334155; height: 100%; margin-bottom: 16px; text-decoration: none; min-height: 132px; }
.tp-mp-tile:hover { text-decoration: none; border-color: #2d80d2; color: #334155; box-shadow: 0 10px 20px rgba(0,0,0,.06); }
.tp-mp-tile.on { border-color: #2d80d2; box-shadow: 0 0 0 1px #2d80d2 inset; }
.tp-mp-tile .icon { width: 42px; height: 42px; border-radius: 8px; background: #eff6ff; color: #2d80d2; display: flex; align-items: center; justify-content: center; font-size: 19px; margin-bottom: 10px; }
.tp-mp-tile h3 { font-size: 16px; margin: 0 0 4px; }
.tp-mp-tile p { font-size: 13.5px; color: #64748b; margin: 0; }
.tp-mp-industry { margin: 2px 0 14px; }
.tp-mp-industry .tp-mp-label { display: inline-block; margin-right: 6px; }

/* post cards */
.tp-mp-post { }
.tp-mp-post-head { display: flex; gap: 12px; align-items: flex-start; }
.tp-mp-logo { width: 52px; height: 52px; border-radius: 8px; background: #e2e8f0; color: #475569; display: flex; align-items: center; justify-content: center; font-weight: 700; font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; flex-shrink: 0; overflow: hidden; font-size: 16px; }
.tp-mp-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.tp-mp-logo.sm { width: 40px; height: 40px; font-size: 13px; }
.tp-mp-post-body { margin-top: 12px; font-size: 15px; line-height: 1.55; color: #334155; }
.tp-mp-post-body.full { font-size: 16px; }
.tp-mp-post-body.full p { margin-bottom: 12px; }
.tp-mp-post-img { margin-top: 12px; border-radius: 8px; overflow: hidden; }
.tp-mp-post-img img { max-width: 100%; height: auto; border-radius: 8px; }
.tp-mp-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #e2e8f0; align-items: center; }
.tp-mp-actions .count { margin-left: auto; font-size: 13.5px; color: #64748b; }
.tp-mp-actions .count b { color: #334155; }
.tp-mp-media { font-size: 13px; color: #64748b; }
.tp-mp-media .fa { margin-right: 3px; }
.tp-mp-media span { margin-right: 10px; }

/* side lists */
.tp-mp-list a { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; color: #334155; border-bottom: 1px solid #f1f5f9; font-size: 14.5px; text-decoration: none; }
.tp-mp-list a:last-child { border-bottom: none; }
.tp-mp-list a:hover { color: #2d80d2; text-decoration: none; }
.tp-mp-list a.on { color: #2d80d2; font-weight: 700; }
.tp-mp-list .n { font-size: 12.5px; color: #94a3b8; white-space: nowrap; margin-left: 8px; }

/* filter card */
.tp-mp-filter label { font-weight: 700; color: #0f172a; font-size: 13.5px; margin: 8px 0 4px; display: block; }
.tp-mp-filter .form-control { height: 36px; font-size: 14px; border-color: #e2e8f0; box-shadow: none; border-radius: 6px; }
.tp-mp-filter .form-control:focus { border-color: #2d80d2; box-shadow: 0 0 0 3px rgba(45,128,210,.15); }
.tp-mp-sort { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 0 0 12px; }
.tp-mp-sort .tp-mp-meta { margin-right: 4px; }

/* ads */
.tp-mp-ad-top { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.tp-mp-ad-top .tp-mp-ad-img { flex-shrink: 0; width: 120px; }
.tp-mp-ad-top .tp-mp-ad-img img { max-width: 120px; max-height: 70px; }
.tp-mp-ad-side img { max-width: 100%; height: auto; border-radius: 6px; }
.tp-mp .marketplace-ad-card { border: 1px solid #cbd5e1; border-radius: 10px; background: #fbfcfd; box-shadow: none; }
.tp-mp .marketplace-ad-card h4 { font-size: 16px; text-transform: none; letter-spacing: 0; }
.tp-mp-sponsor .tp-mp-ad-item { padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid #f1f5f9; }
.tp-mp-sponsor .tp-mp-ad-item:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.tp-mp-sponsor .tp-mp-ad-item .btn { display: inline-block; width: auto; }
.tp-mp-sponsor .tp-mp-ad-item img { max-width: 100%; height: auto; border-radius: 6px; }

/* breadcrumb and post page */
.tp-mp-crumb { font-size: 13.5px; color: #64748b; margin-bottom: 10px; }
.tp-mp-crumb .sep { margin: 0 6px; color: #cbd5e1; }
.tp-mp-attach .tp-mp-label { margin-top: 6px; }
.tp-mp-attach a { display: block; font-size: 14px; margin-bottom: 4px; }
.tp-mp-attach .fa { margin-right: 4px; }
.tp-mp-company .tp-mp-post-head { margin-bottom: 4px; }
.tp-mp-company .badges { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; margin-left: auto; }
.tp-mp-company .d-grid { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.tp-mp-company .d-grid .btn { display: block; width: 100%; text-align: center; }
.tp-mp-narr { font-size: 14px; }
.tp-mp-narr .more { display: none; }
.tp-mp-narr.open .more { display: inline; }
.tp-mp-narr.open .less { display: none; }

/* comments block (ids used by mp.js stay) */
.tp-mp-comments #standalonePostComments { font-size: 14.5px; }
.tp-mp-comments #textareaStandaloneComment { border-radius: 6px; border-color: #e2e8f0; box-shadow: none; min-height: 80px; margin-bottom: 10px; }
.tp-mp-comments .btn-disabled { opacity: .55; }

/* paging */
.tp-mp-more { text-align: center; margin: 6px 0 18px; }
.tp-mp-empty { padding: 28px 18px; text-align: center; color: #64748b; }

@media (max-width: 767px) {
    .tp-mp-hero { padding: 24px 18px 22px; }
    .tp-mp-hero h1 { font-size: 24px; }
    .tp-mp-actions .count { margin-left: 0; width: 100%; }
    .tp-mp-nav .tp-mp-nav-in { padding: 6px 8px; }
    .tp-mp-nav a { padding: 7px 9px; font-size: 14px; }
}

/* create-post modal (10/21/2026): the AjaxControlToolkit pop-up panel in the mockup's look */
.modalPopup15.tp-mp-modal { width: 92%; max-width: 1120px; height: auto; max-height: 92vh; overflow: auto; border: 1px solid #e2e8f0; border-radius: 12px; padding: 18px 22px 22px; text-align: left; box-shadow: 0 20px 60px rgba(0,0,0,.28); background: #f8fafc; }
.tp-mp-modal-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.tp-mp-modal-head h1 { font-size: 24px; margin: 0 0 2px; }
.tp-mp-modal-x { font-size: 14px; color: #64748b !important; white-space: nowrap; }
.tp-mp-modal .tp-mp-card { padding: 16px 18px; }
.tp-mp-modal h2 { font-size: 15px; margin-bottom: 8px; }
.tp-mp-hidden { display: none; }
.tp-mp-picks { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.tp-mp-pick { display: flex; gap: 10px; align-items: flex-start; border: 1px solid #e2e8f0; border-radius: 10px; padding: 10px 12px; background: #fff; color: #0f172a; cursor: pointer; text-decoration: none; min-width: 180px; flex: 1 1 200px; margin: 0; font-weight: 400; }
.tp-mp-pick:hover { border-color: #2d80d2; text-decoration: none; color: #0f172a; }
.tp-mp-pick.selected { border-color: #2d80d2; background: #eff6ff; box-shadow: 0 0 0 1px #2d80d2 inset; }
.tp-mp-pick.locked { background: #f8fafc; color: #64748b; cursor: default; }
.tp-mp-pick.locked:hover { border-color: #e2e8f0; }
.tp-mp-pick > .fa { margin-top: 3px; color: #2d80d2; width: 16px; text-align: center; }
.tp-mp-pick.locked > .fa { color: #94a3b8; }
.tp-mp-pick .pick-body { display: block; min-width: 0; }
.tp-mp-pick .pick-name { display: block; font-weight: 700; }
.tp-mp-pick .tp-mp-meta { display: block; font-size: 12.5px; }
.tp-mp-pick .pick-why { display: inline-block; font-size: 12.5px; color: #92400e; background: #fef3c7; border: 1px solid #fde68a; border-radius: 6px; padding: 3px 7px; margin-top: 6px; }
.tp-mp-pick .tp-mp-request { display: inline-block; font-size: 12.5px; margin-top: 6px; margin-left: 6px; }
.tp-mp-subpick { flex: 1 1 100%; }
.tp-mp-subpick input[type="radio"] { margin: 4px 0 0; flex: none; }
.tp-mp-modal .form-control.tp-mp-input { border-color: #e2e8f0; border-radius: 6px; box-shadow: none; font-size: 14.5px; height: auto; padding: 8px 10px; }
.tp-mp-modal .form-control.tp-mp-input:focus { border-color: #2d80d2; box-shadow: 0 0 0 3px rgba(45,128,210,.15); }
.tp-mp-count { text-align: right; margin-top: 3px; font-size: 12.5px; }
.tp-mp-feedback { display: block; font-size: 13.5px; margin-top: 4px; }
.tp-mp-feedback:empty { display: none; }
.tp-mp-feedback font { font-size: 13.5px; }
.tp-mp-media-card .tp-mp-label { margin-top: 2px; }
.tp-mp-media-card .marketPlaceImageList, .tp-mp-media-card .marketPlacePdfList, .tp-mp-media-card .marketPlaceLinkList, .tp-mp-media-card .marketPlaceVideoList { font-size: 13.5px; margin-bottom: 6px; }
.tp-mp-modal-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; margin-top: 4px; }
.tp-mp-modal-btns { display: flex; gap: 8px; }
.tp-mp-modal-btns .btn { padding: 9px 18px; }
@media (max-width: 767px) { .modalPopup15.tp-mp-modal { width: 96%; padding: 14px; } .tp-mp-pick { flex: 1 1 100%; } }

/* compose window v2 (10/21/2026): two columns, one screen at 1366x768 */
.modalPopup15.tp-mp-modal { max-width: 1000px; padding: 14px 18px 0; display: flex; flex-direction: column; max-height: 92vh; }
.tp-mp-modal-head { margin-bottom: 10px; flex: none; }
.tp-mp-modal-head h1 { font-size: 20px; }
.tp-mp-compose { display: flex; gap: 16px; align-items: flex-start; overflow: auto; flex: 1 1 auto; min-height: 0; padding-bottom: 8px; }
.tp-mp-compose-left { flex: 0 0 250px; min-width: 0; }
.tp-mp-compose-right { flex: 1 1 auto; min-width: 0; }
.tp-mp-seclist { background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 4px; }
.tp-mp-secwrap { border-bottom: 1px solid #f1f5f9; }
.tp-mp-secwrap:last-child { border-bottom: none; }
.tp-mp-secitem { display: flex; align-items: center; gap: 8px; padding: 8px 10px; color: #0f172a; font-weight: 600; font-size: 14px; border-radius: 6px; text-decoration: none; }
.tp-mp-secitem:hover { background: #f1f5f9; text-decoration: none; color: #0f172a; }
.tp-mp-secitem.selected { background: #eff6ff; color: #1d5fa3; }
.tp-mp-secitem.locked { color: #94a3b8; cursor: default; }
.tp-mp-secitem > .fa { width: 16px; text-align: center; color: #2d80d2; }
.tp-mp-secitem.locked > .fa { color: #94a3b8; }
.tp-mp-secitem .name { flex: 1 1 auto; }
.tp-mp-secitem .lock { color: #94a3b8; }
.tp-mp-secitem.tp-mp-more { color: #64748b; font-weight: 600; }
.tp-mp-secitem .tp-caret { color: #94a3b8; }
.tp-mp-morecats .tp-mp-morecats-body { display: none; }
.tp-mp-morecats.open .tp-mp-morecats-body { display: block; }
.tp-mp-subitem { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 0 14px; padding: 6px 10px; font-weight: 400; font-size: 13.5px; color: #334155; border-radius: 6px; cursor: pointer; }
.tp-mp-subitem:hover { background: #f8fafc; }
.tp-mp-subitem.selected { background: #eff6ff; color: #1d5fa3; font-weight: 600; }
.tp-mp-subitem.locked { color: #94a3b8; cursor: default; }
.tp-mp-subitem input[type="radio"] { margin: 3px 0 0; flex: none; }
.tp-mp-secwrap .pick-why { display: inline-block; font-size: 12px; color: #92400e; background: #fef3c7; border: 1px solid #fde68a; border-radius: 6px; padding: 2px 7px; margin: 2px 0 4px 14px; }
.tp-mp-secwrap .tp-mp-request { font-size: 12px; margin-left: 6px; }
.tp-mp-toggle { display: block; margin-top: 10px; font-size: 14px; font-weight: 600; color: #334155; text-decoration: none; }
.tp-mp-toggle:hover { text-decoration: none; color: #2d80d2; }
.tp-mp-toggle .tp-caret { width: 12px; display: inline-block; color: #94a3b8; transition: transform .15s; }
.tp-mp-toggle-body { display: none; margin-top: 8px; }
.tp-mp-toggle-body.open { display: block; }
.tp-mp-toggle-body.tp-mp-media-card { padding: 10px 12px; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; }
.tp-mp-modal .tp-mp-modal-foot { position: sticky; bottom: 0; background: #f8fafc; border-top: 1px solid #e2e8f0; margin: 0 -18px; padding: 10px 18px; flex: none; }
.modalPopup16.tp-mp-success { width: 92%; max-width: 560px; height: auto; min-height: 0; padding: 28px 28px 24px; text-align: center; display: block; border: 1px solid #e2e8f0; border-radius: 12px; background: #f8fafc; box-shadow: 0 20px 60px rgba(0,0,0,.28); }
.tp-mp-success-icon { font-size: 48px; color: #10b981; margin-bottom: 6px; }
.tp-mp-success h1 { font-size: 24px; margin-bottom: 6px; }
.tp-mp-success-post { font-size: 16px; font-weight: 700; color: #0f172a; margin-bottom: 18px; }
.tp-mp-success-btns { justify-content: center; flex-wrap: wrap; }
@media (max-width: 767px) {
    .tp-mp-compose { flex-direction: column; }
    .tp-mp-compose-left { flex: 1 1 auto; width: 100%; }
    .modalPopup15.tp-mp-modal { padding: 12px 12px 0; }
    .tp-mp-modal .tp-mp-modal-foot { margin: 0 -12px; padding: 10px 12px; }
}

/* My Posts (10/21/2026) */
.tp-mp-select.form-control { height: 36px; font-size: 14px; border-color: #e2e8f0; box-shadow: none; border-radius: 6px; width: auto; display: inline-block; }
.tp-mp-stats { display: flex; flex-wrap: wrap; }
.tp-mp-stats .stat { flex: 1 1 110px; text-align: center; padding: 10px 6px; }
.tp-mp-stats .num { font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 26px; font-weight: 700; color: #0f172a; line-height: 1.1; }
.tp-mp-stats .lbl { font-size: 12px; color: #64748b; text-transform: uppercase; letter-spacing: .04em; margin-top: 4px; }
.tp-mp-stats .delta { font-size: 12px; color: #047857; min-height: 16px; }
.tp-mp-bars { display: flex; align-items: flex-end; gap: 6px; height: 120px; padding: 0 4px; margin-top: 10px; }
.tp-mp-bars div { flex: 1; background: #bfdbfe; border-radius: 3px 3px 0 0; min-height: 1px; }
.tp-mp-bars div.hi { background: #2d80d2; }
.tp-mp-bars-x { display: flex; gap: 6px; padding: 4px 4px 0; font-size: 11px; color: #94a3b8; }
.tp-mp-bars-x span { flex: 1; text-align: center; }
.table-wrap { overflow-x: auto; }
.tp-mp-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.tp-mp-table th { font-size: 11.5px; color: #94a3b8; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; border-bottom: 1px solid #e2e8f0; padding: 6px 8px; text-align: left; }
.tp-mp-table td { padding: 10px 8px; border-bottom: 1px solid #f1f5f9; vertical-align: middle; }
.tp-mp-table th.num, .tp-mp-table td.num { text-align: right; white-space: nowrap; }
.tp-mp-table tr.paused td { opacity: .6; }
.tp-mp-table .tp-mp-row-title { font-weight: 700; color: #0f172a; }
.tp-mp-table td.actions { white-space: nowrap; text-align: right; }
.tp-mp-table td.actions a { margin-left: 10px; font-size: 13.5px; }
.tp-mp-list .rank { width: 22px; height: 22px; border-radius: 50%; background: #f1f5f9; color: #334155; font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; margin-right: 8px; }
.tp-mp-list a .tp-mp-mini { margin-left: 8px; }
.tp-mp-mini { font-size: 12.5px; font-weight: 700; color: #2d80d2; }
.tp-mp-crm-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid #e2e8f0; border-radius: 8px; background: #f8fafc; margin-bottom: 12px; }
.tp-mp-crm-bar .tp-mp-select.form-control { height: auto; min-width: 220px; }
.tp-mp-table tbody tr:last-child td { border-bottom: none; }

/* Chris's second test (10/21/2026): one caret, no sideways scroll, locked Create Post, red lines, kept files, Edit links */
.modalPopup15.tp-mp-modal, .modalPopup16.tp-mp-success { overflow: hidden; overflow-x: hidden; }
.tp-mp-compose { overflow-x: hidden; }
.tp-caret { width: 12px; display: inline-block; text-align: center; color: #94a3b8; transition: transform .15s; }
.tp-mp-toggle.open .tp-caret, .tp-mp-morecats.open .tp-caret { transform: rotate(90deg); }
.tp-mp-hint { display: none; color: #c63939; font-size: 13px; margin-top: 4px; }
.tp-mp-hint.show { display: block; }
.tp-mp .btn.tp-mp-btn-teal.tp-mp-btn-locked { background: #d5d9e0; border-color: #d5d9e0; color: #6b7280; cursor: not-allowed; }
.tp-mp .btn.tp-mp-btn-teal.tp-mp-btn-locked:hover, .tp-mp .btn.tp-mp-btn-teal.tp-mp-btn-locked:focus { background: #d5d9e0; border-color: #d5d9e0; color: #6b7280; }
#tpMpPrevCat.placeholder { color: #94a3b8; }
.tp-mp-staged { font-size: 13.5px; margin: 4px 0; color: #0f172a; }
.tp-mp-staged .fa-check-circle { color: #10b981; }
.tp-mp-staged a { margin-left: 6px; }
.tp-mp-list .tp-mp-myrow { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #f1f5f9; }
.tp-mp-list .tp-mp-myrow:last-child { border-bottom: none; }
.tp-mp-list .tp-mp-myrow > a { flex: 1 1 auto; min-width: 0; border-bottom: none; }
.tp-mp-list .tp-mp-myrow .tp-mp-edit { display: inline; padding: 0; border: none; font-size: 12.5px; color: #64748b; white-space: nowrap; }
.tp-mp-list .tp-mp-myrow .tp-mp-edit:hover { color: #2d80d2; }

/* Chris's recheck (10/21/2026): client-side section pick, small spinner, in-place New Post, My Posts table that fits 1280 */
/* Round 4 (10/21/2026): the title is the header as typed, one line; the pick sits under it; the "Find a subcategory"
   box and its result list; the "Discard this post?" dialog inside the window. */
.tp-mp-modal-head-text { flex: 1 1 auto; min-width: 0; }
.tp-mp-modal-head h1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tp-mp-modal-head .tp-mp-posting { margin: 2px 0 0; }
.tp-mp-find { position: relative; margin-bottom: 8px; }
.tp-mp-modal .tp-mp-find .form-control.tp-mp-input { padding: 6px 30px 6px 10px; font-size: 13.5px; }
.tp-mp-find-clear { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); border: 0; background: none; color: #94a3b8; padding: 4px 7px; display: none; line-height: 1; }
.tp-mp-find-clear:hover { color: #0f172a; }
.tp-mp-find.has .tp-mp-find-clear { display: block; }
.tp-mp-findlist { display: none; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 4px; }
.tp-mp-findlist.show { display: block; }
.tp-mp-finditem { display: block; padding: 7px 10px; border-radius: 6px; font-size: 13.5px; color: #334155; text-decoration: none; }
.tp-mp-finditem:hover, .tp-mp-finditem.active { background: #eff6ff; color: #1d5fa3; text-decoration: none; }
.tp-mp-finditem .sec { color: #64748b; }
.tp-mp-finditem .sep { color: #94a3b8; margin: 0 5px; }
.tp-mp-finditem .sub { font-weight: 600; }
.tp-mp-findlist .tp-mp-meta { padding: 7px 10px; }
.tp-mp-confirm { position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(15,23,42,.45); z-index: 60; display: flex; align-items: center; justify-content: center; padding: 16px; }
.tp-mp-confirm-box { background: #fff; border-radius: 12px; padding: 20px 22px; max-width: 400px; width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,.3); text-align: left; }
.tp-mp-confirm-title { font-size: 17px; font-weight: 700; color: #0f172a; margin-bottom: 4px; }
.tp-mp-confirm-text { font-size: 14px; color: #64748b; margin-bottom: 16px; }
.tp-mp-confirm-btns { display: flex; gap: 8px; justify-content: flex-end; }
/* My Promotions details modal (round 4): the panel is the backdrop, the card the window; the row it came from is
   highlighted while open and fades after Close. Below the toolkit popups (10000) so Message opens above it. */
.tp-mp-dlg-back { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 1050; background: rgba(15,23,42,.55); overflow: auto; padding: 40px 16px; }
.tp-mp-dlg { max-width: 1040px; margin: 0 auto; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
body.tp-mp-dlg-open { overflow: hidden; }
.tp-mp-table tr.active td { background: #eff6ff; }
.tp-mp-table tr.was td { animation: tpMpRowFade 2.6s forwards; }
@keyframes tpMpRowFade { 0%, 45% { background-color: #eff6ff; } 100% { background-color: transparent; } }
@media (max-width: 767px) { .tp-mp-dlg-back { padding: 12px 8px; } }
/* Window height (round 4 fix, 10/21/2026): the popup extender centres the window once, when it opens, and never
   again, so a section list that grows afterwards pushed the footer below the screen. The window now sits 4vh from the
   top with its 92vh cap, so the bottom is always on screen; title and footer stay put and each column scrolls on its
   own (search box pinned above the section list). !important because the extender writes an inline top. */
@media (min-width: 768px) {
    .modalPopup15.tp-mp-modal { top: 4vh !important; }
    .tp-mp-compose { overflow: hidden; align-items: stretch; }
    .tp-mp-compose-left { display: flex; flex-direction: column; min-height: 0; }
    .tp-mp-compose-left .tp-mp-label, .tp-mp-compose-left .tp-mp-find, .tp-mp-compose-left .tp-mp-hint, .tp-mp-compose-left .tp-mp-feedback { flex: none; }
    .tp-mp-compose-left .tp-mp-seclist, .tp-mp-compose-left .tp-mp-findlist.show { overflow: auto; flex: 0 1 auto; min-height: 0; }
    .tp-mp-compose-right { overflow: auto; min-height: 0; padding-right: 2px; }
}
/* My Posts row expand (Tim, 10/21/2026): who viewed, follows and clicked one post, under its row. */
.tp-mp-table tr.tp-mp-expand td { background: #f8fafc; padding: 10px 14px 12px; border-top: none; }
.tp-mp-expand-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 6px; }
.tp-mp-expand-head .tp-mp-meta { flex: 1 1 auto; }
.tp-mp-expand-cols { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; }
.tp-mp-expand-col { flex: 1 1 200px; min-width: 0; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 8px 12px; }
.tp-mp-expand .tp-mp-list { max-height: 260px; overflow-y: auto; overflow-x: hidden; }
/* each row: company name with the actions on the line below it, then the small grey line (views, when, what) */
.tp-mp-expand .tp-mp-list .tp-mp-xrow { display: block; padding: 6px 0; border-bottom: 1px solid #f1f5f9; }
.tp-mp-expand .tp-mp-list .tp-mp-xrow:last-child { border-bottom: none; }
.tp-mp-expand .tp-mp-list .tp-mp-xrow > a { display: block; padding: 0; border: none; font-size: 13.5px; }
.tp-mp-expand .tp-mp-list .tp-mp-xrow > a > span:first-child { display: block; font-weight: 600; overflow-wrap: anywhere; }
.tp-mp-expand .tp-mp-list .tp-mp-xrow > a .n { display: block; margin: 0; white-space: normal; font-size: 12px; }
.tp-mp-expand .tp-mp-list .tp-mp-xrow .tp-mp-mini { display: inline-block; margin: 2px 10px 0 0; font-size: 12px; white-space: nowrap; }
/* My Promotions: "Who sees it" lines in the summary */
.tp-mp-who { font-size: 13px; color: #334155; margin: 2px 0; font-weight: 400; }
.tp-mp-who .k { display: inline-block; min-width: 86px; color: #64748b; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; }
.tp-mp-summary .tp-mp-mini { font-size: 12px; margin-left: 6px; }
/* Post page pop-ups (10/22/2026): share, share comment, report, report comment, I'm interested. jquery-modal moves them
   under its .blocker, outside .tp-mp, so the pop-up carries tp-mp itself. */
.modal.tp-mp-pop { max-width: 520px; width: 92%; border-radius: 12px; padding: 18px 22px 20px; text-align: left; box-shadow: 0 20px 60px rgba(0,0,0,.3); font-size: 14px; }
.modal.tp-mp-pop.tp-mp-pop-wide { max-width: 600px; }
.tp-mp-pop-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.tp-mp-pop-title { font-size: 18px; font-weight: 700; color: #0f172a; margin-bottom: 2px; }
.tp-mp-pop .tp-mp-modal-x { font-size: 16px; color: #64748b !important; padding: 2px 4px; }
.tp-mp-pop-field { margin-bottom: 8px; }
.tp-mp-pop .form-control.tp-mp-input { border-color: #e2e8f0; border-radius: 6px; box-shadow: none; font-size: 14.5px; height: auto; padding: 8px 10px; width: 100%; }
.tp-mp-pop .form-control.tp-mp-input:focus { border-color: #2d80d2; box-shadow: 0 0 0 3px rgba(45,128,210,.15); }
.tp-mp-pop-btns { display: flex; gap: 8px; justify-content: flex-end; margin-top: 14px; }
.tp-mp-share-list { max-height: 50vh; overflow: auto; border: 1px solid #e2e8f0; border-radius: 8px; }
.tp-mp-share-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 12px; border-bottom: 1px solid #f1f5f9; }
.tp-mp-share-row:last-child { border-bottom: none; }
.tp-mp-share-who { min-width: 0; }
.tp-mp-share-who b { display: block; font-size: 14px; color: #0f172a; }
.tp-mp-share-who .tp-mp-meta { display: block; overflow-wrap: anywhere; }
.tp-mp-pop .btn.btn-disabled { background: #e2e8f0; border-color: #e2e8f0; color: #64748b; }
.tp-mp-pop .shareSentButton { color: #047857; font-weight: 700; }
/* Details modal tables: the action icons never wrap and the company column takes the rest (10/22/2026) */
.tp-mp-promo-details .tp-mp-table td.actions { white-space: nowrap; width: 1%; }
.tp-mp-promo-details .tp-mp-table td:first-child { overflow-wrap: anywhere; }
.tp-mp-promo-details .tp-mp-table td .tp-mp-meta { white-space: nowrap; }
/* Promotion (ad) slot (10/22/2026) */
.tp-mp-ad { background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 12px 14px; margin-bottom: 16px; }
.tp-mp-ad-tag { font-size: 11px; color: #94a3b8; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; margin-bottom: 6px; }
.tp-mp-ad-title { font-size: 15px; font-weight: 700; color: #0f172a; margin-bottom: 6px; }
.tp-mp-ad-img { display: block; margin-bottom: 8px; }
.tp-mp-ad-img img { max-width: 100%; height: auto; border-radius: 6px; }
.tp-mp-ad-body { font-size: 13.5px; color: #334155; margin-bottom: 4px; overflow-wrap: anywhere; }
.tp-mp-ad-btns { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.tp-mp-posting { font-size: 12.5px; color: #64748b; margin: -4px 0 8px; line-height: 1.3; }
.tp-mp-posting b { color: #1d5fa3; }
.tp-mp-posting.none .tp-mp-posting-lead { display: none; }
.tp-mp-posting.none b { color: #94a3b8; font-weight: 400; }
.tp-mp-secwrap .tp-mp-subs { display: none; }
.tp-mp-secwrap.selected .tp-mp-subs { display: block; }
.tp-mp-progress { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 100001; width: 64px; height: 64px; border-radius: 50%; background: rgba(255,255,255,.95); box-shadow: 0 6px 24px rgba(0,0,0,.22); display: flex; align-items: center; justify-content: center; font-size: 30px; color: #2d80d2; }
.tp-mp-newpost-block a[id$="lnkCreatePost"] { display: block !important; width: 100% !important; text-align: center; }
.tp-mp-card { min-width: 0; }
.tp-mp-card .table-wrap { overflow-x: auto; max-width: 100%; }
/* Round 3 (10/21/2026): at 1280 the table (695px) overflowed its 664px box and scrolled on its own, clipping the third
   icon and the "Duplicate" tooltip. Status now sits in the Post cell's meta line (one column fewer), the number columns
   and icons are tighter, and on desktop the box no longer clips, so tooltips can stand above the first row. */
@media (min-width: 992px) { .tp-mp-card .table-wrap { overflow: visible; } }
.tp-mp-table th { white-space: normal; padding: 6px 5px; font-size: 10.5px; letter-spacing: .02em; }
.tp-mp-table td { padding: 9px 5px; }
.tp-mp-table th.num, .tp-mp-table td.num { padding-left: 5px; padding-right: 5px; font-size: 13px; }
.tp-mp-table .tp-mp-row-title { white-space: normal; overflow-wrap: anywhere; }
.tp-mp-table .tp-mp-meta { font-size: 12.5px; }
.tp-mp-table .tp-mp-meta .tp-mp-badge { font-size: 10px; padding: 1px 5px; line-height: 1.3; }
.tp-mp-table td.actions { white-space: nowrap; padding-left: 2px; }
.tp-mp-table td.actions a.tp-mp-ico { display: inline-block; width: 26px; height: 26px; line-height: 26px; text-align: center; border-radius: 6px; margin-left: 3px; color: #64748b; background: #f1f5f9; font-size: 12.5px; }
.tp-mp-table td.actions a.tp-mp-ico:hover { color: #fff; background: #2d80d2; text-decoration: none; }
.tp-mp-list a > span:first-child { min-width: 0; overflow-wrap: anywhere; }
.tp-mp-label { overflow-wrap: anywhere; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

/* Round 2 (10/21/2026): comment rows in the post's button style, like toggle state, icon tooltips */
.tp-mp .btn.tp-mp-btn-xs { padding: 3px 9px; font-size: 12.5px; }
/* Round 3 (10/21/2026): a comment is one block (text and its buttons together, no divider between them); every other
   top-level comment gets a light shade, like a spreadsheet; the company initials circle (same rule as the header)
   leads the name; replies sit indented inside the parent's block. */
.tp-mp-comment { padding: 12px 14px; border-radius: 8px; }
#standalonePostComments > .tp-mp-comment + .tp-mp-comment { margin-top: 4px; }
#standalonePostComments > .tp-mp-comment:nth-child(even) { background: #f5f7fa; }
.tp-mp-comment-head { display: flex; align-items: center; gap: 9px; font-size: 14px; color: #0f172a; min-width: 0; }
.tp-mp-comment-head .tp-mp-comment-who { min-width: 0; overflow-wrap: anywhere; }
.tp-mp-comment-head .tp-mp-meta { display: inline; }
.tp-mp-comment-ini { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: #2f6fae; color: #fff; font-size: 12px; font-weight: 700; flex: 0 0 30px; }
.tp-mp-comment-body { margin: 6px 0 0 39px; font-size: 14.5px; color: #334155; overflow-wrap: anywhere; }
.tp-mp-comment-actions { margin: 6px 0 0 39px; padding-top: 0; border-top: none; gap: 6px; }
.tp-mp-comment-actions .count { font-size: 12.5px; color: #64748b; margin-left: 6px; }
.tp-mp-comment-editor { margin: 10px 0 0 39px; }
.tp-mp-comment-editor-btns { margin-top: 6px; }
.tp-mp-comment-reply { margin: 10px 0 0 39px; border-left: 2px solid #dbe3ee; padding-left: 12px; }
.tp-mp-comment-reply .tp-mp-comment { padding: 6px 0; background: transparent; }
.tp-mp-comment-reply .tp-mp-comment-ini { width: 24px; height: 24px; flex-basis: 24px; font-size: 10.5px; }
.tp-mp-comment-reply .tp-mp-comment-body, .tp-mp-comment-reply .tp-mp-comment-actions, .tp-mp-comment-reply .tp-mp-comment-editor, .tp-mp-comment-reply .tp-mp-comment-reply { margin-left: 33px; }
@media (max-width: 480px) {
    .tp-mp-comment { padding: 10px 10px; }
    .tp-mp-comment-body, .tp-mp-comment-actions, .tp-mp-comment-editor, .tp-mp-comment-reply { margin-left: 0; }
}
.tp-mp .btn.tp-mp-btn-ghost.on { background: #eff6ff; border-color: #bfdbfe; color: #1d5fa3; }
.tp-mp-table td.actions a.tp-mp-ico { position: relative; }
.tp-mp-table td.actions a.tp-mp-ico[data-tip]:hover::after, .tp-mp-table td.actions a.tp-mp-ico[data-tip]:focus::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); background: #0f172a; color: #fff; font-size: 12px; line-height: 1.2; padding: 5px 8px; border-radius: 6px; white-space: nowrap; z-index: 20; pointer-events: none; }
.tp-mp-table td.actions a.tp-mp-ico[data-tip]:hover::before, .tp-mp-table td.actions a.tp-mp-ico[data-tip]:focus::before { content: ""; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); border: 6px solid transparent; border-top-color: #0f172a; z-index: 20; pointer-events: none; }
/* The last icon's tooltip hangs to the left so it never runs past the card's right edge (round 3). */
.tp-mp-table td.actions a.tp-mp-ico:last-child[data-tip]:hover::after, .tp-mp-table td.actions a.tp-mp-ico:last-child[data-tip]:focus::after { left: auto; right: 0; transform: none; }

/* My Promotions (round (a), 10/21/2026): details card, small tables, notes modal */
.tp-mp-h2 { margin: 4px 0 0; font-size: 18px; font-weight: 700; color: #0f172a; }
.tp-mp-h2 .tp-mp-badge { margin-left: 8px; vertical-align: middle; }
.tp-mp-badge.tp-mp-badge-red { background: #fee2e2; color: #b91c1c; border-color: #fecaca; }
.tp-mp-table.tp-mp-table-sm { font-size: 13px; }
.tp-mp-table.tp-mp-table-sm td { padding: 6px 5px; }
.tp-mp-table td.pick { width: 26px; padding-right: 0; }
.tp-mp-table td.pick input { margin: 0; }
.tp-mp-summary { font-size: 13.5px; color: #334155; }
.tp-mp-summary h4 { font-size: 15px; margin: 0 0 6px; }
.tp-mp-summary h5 { display: none; }
.tp-mp-summary hr { margin: 8px 0; }
.tp-mp-summary br { display: none; }
.tp-mp-summary .row { margin: 0 0 4px; }
.tp-mp-summary [class*="col-"] { padding: 0; }
.tp-mp-crm-tags label { font-weight: 400; margin: 0 10px 0 2px; font-size: 13px; }
.tp-mp-crm-tags input { margin-right: 3px; }
.tp-mp-notes .tp-mp-note { padding: 8px 0; border-bottom: 1px solid #f1f5f9; }
.tp-mp-notes .tp-mp-note:last-child { border-bottom: none; }

/* Posting paused / rejected notices (evening queue (c), 10/21/2026) */
.tp-mp-notice { background: #fef3c7; border: 1px solid #fde68a; color: #92400e; border-radius: 8px; padding: 8px 12px; font-size: 13.5px; margin: 0 0 10px; }
.tp-mp-notice.reject { background: #fee2e2; border-color: #fecaca; color: #b91c1c; }
.tp-mp-paused { display: inline-block; background: #fef3c7; border: 1px solid #fde68a; color: #92400e; border-radius: 8px; padding: 6px 10px; font-size: 13.5px; font-weight: 400; }

/* Round 6 (10/22/2026): clickable rows and cards, teal titles, soft focus ring, nav search, interest toggle, quiet report link */
.tp-mp-table a.tp-mp-row-title, a.tp-mp-title { color: #047857; }
.tp-mp-table a.tp-mp-row-title:hover, a.tp-mp-title:hover { color: #065f46; text-decoration: underline; }
.tp-mp-rowlink { cursor: pointer; }
.tp-mp-table tr.tp-mp-rowlink:hover td { background: #f8fafc; }
.tp-mp-table tr.tp-mp-rowlink.active td, .tp-mp-table tr.tp-mp-rowlink.active:hover td { background: #eff6ff; }
.tp-mp a:focus, .tp-mp-table a:focus, .tp-mp-card a:focus, .tp-mp-nav a:focus, .tp-mp .btn:focus, .tp-mp-ico:focus, a.tp-mp-title:focus, a.tp-mp-row-title:focus { outline: 3px solid rgba(16,185,129,.45); outline-offset: 2px; border-radius: 4px; }
.tp-mp a:focus:not(:focus-visible), .tp-mp-table a:focus:not(:focus-visible), .tp-mp-card a:focus:not(:focus-visible), .tp-mp-nav a:focus:not(:focus-visible), .tp-mp .btn:focus:not(:focus-visible), .tp-mp-ico:focus:not(:focus-visible), a.tp-mp-title:focus:not(:focus-visible), a.tp-mp-row-title:focus:not(:focus-visible) { outline: none; }
.tp-mp-nav .tp-mp-nav-search { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.tp-mp-nav .tp-mp-nav-search .form-control { height: 32px; width: 230px; font-size: 13.5px; border-radius: 6px; box-shadow: none; border-color: #e2e8f0; }
.tp-mp-nav .tp-mp-nav-search .form-control:focus { border-color: #10b981; box-shadow: 0 0 0 3px rgba(16,185,129,.18); }
.tp-mp-nav a.tp-mp-nav-search-go { display: inline-block; width: 32px; height: 32px; line-height: 32px; padding: 0; text-align: center; border-radius: 6px; color: #475569; background: #f1f5f9; font-size: 14px; }
.tp-mp-nav a.tp-mp-nav-search-go:hover { color: #fff; background: #10b981; text-decoration: none; }
.tp-mp .btn.tp-mp-btn-ghost.tp-mp-interested.on { color: #047857; border-color: #10b981; background: #ecfdf5; }
.tp-mp-actions a.tp-mp-report-link { font-size: 12.5px; color: #94a3b8; margin-left: 12px; white-space: nowrap; }
.tp-mp-actions a.tp-mp-report-link:hover { color: #b91c1c; text-decoration: underline; }
.tp-mp-actions a.tp-mp-report-link[disabled] { color: #94a3b8; text-decoration: none; cursor: default; }
@media (max-width: 767px) {
    .tp-mp-nav .tp-mp-nav-search { margin-left: 0; width: 100%; }
    .tp-mp-nav .tp-mp-nav-search .form-control { flex: 1 1 auto; width: auto; }
    .tp-mp-actions a.tp-mp-report-link { margin-left: 0; }
}

/* Post stats line (header round 12a, 10/22/2026): "5 views · 1 like · 3 comments" on the cards and the post page. Numbers dark
   semibold, labels muted 13 px, a middle dot with 8 px each side between items (drawn after each item but the last, so a
   wrapped line never starts with a dot); each item stays on one line. */
.tp-mp-actions .count { font-size: 13px; color: #64748b; }
.tp-mp-actions .count .tp-stat { white-space: nowrap; }
.tp-mp-actions .count .tp-stat b { color: #0f172a; font-weight: 600; }
.tp-mp-actions .count .tp-stat:not(:last-child)::after { content: "\00B7"; margin: 0 8px; color: #94a3b8; font-weight: 700; }

/* Section tiles (round 13, 10/22/2026): the counts are a stats row under the description, in a light teal pill, same style as the
   post stats line; the tiles in a row share the row's height and the stats row sits at the bottom of every tile. */
.tp-mp-tiles .row { display: flex; flex-wrap: wrap; }
.tp-mp-tiles .row > [class*="col-"] { display: flex; }
.tp-mp-tile { display: flex; flex-direction: column; flex: 1 1 100%; width: 100%; }
.tp-mp-tile p { flex: 1 1 auto; }
.tp-mp-tile-stats { margin-top: 10px; align-self: flex-start; display: inline-flex; flex-wrap: wrap; align-items: center; padding: 4px 10px; border-radius: 999px; background: #ecfdf5; border: 1px solid #a7f3d0; font-size: 12.5px; color: #64748b; line-height: 1.3; }
.tp-mp-tile-stats .tp-stat { white-space: nowrap; }
.tp-mp-tile-stats .tp-stat b { color: #0f172a; font-weight: 600; }
.tp-mp-tile-stats .tp-stat:not(:last-child)::after { content: "\00B7"; margin: 0 7px; color: #94a3b8; font-weight: 700; }
@media (max-width: 767px) { .tp-mp-tiles .row > [class*="col-"] { flex: 0 0 100%; max-width: 100%; } }
/* 10/27/2026 (handoff 22 item 5): the Find company card under Filter posts on cat.aspx, and the result rows the classic
   master's helper also prints. */
.tp-mp-filter .tp-mp-find-btn { margin-top: 10px; }
.tp-mp-find-results { margin-top: 10px; font-size: 13.5px; line-height: 1.45; }
.tp-mp-find-row { display: block; padding: 6px 0; border-top: 1px solid #eef1f5; }
.tp-mp-find-row:first-child { border-top: 0; }
.tp-mp-find-row a { font-weight: 700; color: #047857; }
