/* Shared agency table component. Used by the homepage and catalog pages. */
.tablecard.agency-table-card,
.agency-table-wrap{
  width:100%;
  max-width:100%;
  border:1px solid var(--line);
  border-radius:var(--r-lg,18px);
  box-shadow:var(--shadow,var(--shadow-soft,0 18px 50px rgba(20,20,30,.08)));
  background:#fff;
  padding:12px;
  overflow:hidden;
}

.oma-agency-table,
.agency-table{
  width:100%;
  max-width:100%;
  table-layout:fixed;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
}

.oma-agency-table thead th,
.agency-table thead th{
  text-align:left;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.07em;
  color:var(--ink-40);
  font-weight:700;
  padding:13px 14px;
  background:var(--bg-alt);
  border-bottom:1px solid var(--line);
}

.oma-agency-table thead th:first-child,
.agency-table thead th:first-child{border-top-left-radius:16px}

.oma-agency-table thead th:last-child,
.agency-table thead th:last-child{border-top-right-radius:16px}

.oma-agency-table thead th:nth-child(1),
.agency-table thead th:nth-child(1){width:76px}

.oma-agency-table thead th:nth-child(3),
.agency-table thead th:nth-child(3){width:240px}

.oma-agency-table thead th:nth-child(4),
.agency-table thead th:nth-child(4){width:172px}

.oma-agency-table thead th:nth-child(5),
.agency-table thead th:nth-child(5){width:224px}

.oma-agency-table td,
.agency-table td{
  padding:13px 12px;
  vertical-align:middle;
  border-bottom:1px solid var(--line);
}

.oma-agency-table tr:last-child td,
.agency-table tr:last-child td{border-bottom:0}

.oma-agency-table tr:last-child td:first-child,
.agency-table tr:last-child td:first-child{border-bottom-left-radius:16px}

.oma-agency-table tr:last-child td:last-child,
.agency-table tr:last-child td:last-child{border-bottom-right-radius:16px}

.oma-agency-table tbody tr:hover td,
.agency-table tbody tr:hover td{background:var(--coral-soft)}

.oma-agency-table .c-rank,
.agency-table .c-rank{
  width:76px;
  text-align:center;
  padding-left:16px;
  padding-right:16px;
}

.oma-agency-table .c-name,
.agency-table .c-name{width:auto}

.oma-agency-table .c-adv,
.oma-agency-table .c-strengths,
.agency-table .c-adv,
.agency-table .c-strengths{width:240px}

.oma-agency-table .c-country,
.agency-table .c-country{width:172px}

.oma-agency-table .c-links,
.agency-table .c-links{
  width:224px;
  text-align:right;
}

.name-wrap,
.agency-name-cell{
  display:flex;
  align-items:center;
  gap:13px;
  min-width:0;
}

.name-text{display:flex;flex-direction:column;min-width:0}
.aname-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

.ava,
.agency-avatar{
  flex:none;
  width:42px;
  height:42px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,var(--coral),var(--coral-dark,#C9425E));
  color:#fff;
  font-weight:800;
  font-size:.86rem;
  box-shadow:0 4px 12px rgba(232,96,122,.22);
}

.aname,
.agency-table-name{
  color:var(--ink);
  font-weight:650;
  font-size:.98rem;
  line-height:1.25;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.aname:hover,
.agency-table-name:hover{color:var(--coral-dark,var(--coral))}

.atag,
.agency-table-tagline{
  display:block;
  margin-top:4px;
  color:var(--ink-40);
  font-size:.8rem;
  line-height:1.35;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:300px;
}

.country-cell{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.92rem;
  line-height:1.45;
}

.flag{font-size:1.15rem}
.dash{color:var(--ink-40)}

.strength-icons,
.strength-row{
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:wrap;
}

.est-badge{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  margin-left:8px;
  padding:3px 8px;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--ink-50);
  background:#fff;
  font-size:.72rem;
  font-weight:700;
  white-space:nowrap;
}

.verified-badge{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  margin-left:8px;
  padding:3px 8px;
  border:1px solid #A7D7BB;
  border-radius:999px;
  color:#187244;
  background:#ECF8F0;
  font-size:.72rem;
  font-weight:800;
  white-space:nowrap;
}

.adv-row{
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:wrap;
}

.strength-icon{
  position:relative;
  width:30px;
  height:30px;
  display:inline-grid;
  place-items:center;
  border-radius:9px;
  background:var(--bg-alt);
  color:var(--coral);
  cursor:help;
  flex:0 0 30px;
}

.adv{
  position:relative;
  width:30px;
  height:30px;
  display:inline-grid;
  place-items:center;
  border-radius:9px;
  background:var(--bg-alt);
  color:var(--coral);
  cursor:help;
  flex:0 0 30px;
}

.strength-icon svg{width:16px;height:16px}
.adv svg{width:16px;height:16px}

.strength-tip{
  position:absolute;
  left:50%;
  bottom:calc(100% + 8px);
  z-index:20;
  width:190px;
  transform:translateX(-50%) translateY(4px);
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  box-shadow:var(--shadow-soft);
  color:var(--ink-60);
  font-size:.72rem;
  line-height:1.35;
  opacity:0;
  pointer-events:none;
  transition:.16s ease;
}

.adv-tip{
  position:absolute;
  left:50%;
  bottom:calc(100% + 8px);
  z-index:20;
  width:190px;
  transform:translateX(-50%) translateY(4px);
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  box-shadow:var(--shadow-soft);
  color:var(--ink-60);
  font-size:.72rem;
  line-height:1.35;
  opacity:0;
  pointer-events:none;
  transition:.16s ease;
}

.strength-tip b{
  display:block;
  margin-bottom:3px;
  color:var(--ink);
  font-size:.76rem;
}

.adv-tip b{
  display:block;
  margin-bottom:3px;
  color:var(--ink);
  font-size:.76rem;
}

.strength-icon:hover .strength-tip,
.strength-icon:focus .strength-tip{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

.adv:hover .adv-tip,
.adv:focus .adv-tip{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

.strength-chip{
  display:inline-flex;
  align-items:center;
  max-width:100px;
  min-height:30px;
  padding:0 10px;
  border-radius:9px;
  background:var(--bg-alt);
  color:var(--ink-60);
  font-size:.74rem;
  font-weight:650;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.links-cell{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:4px;
  flex-wrap:wrap;
  max-width:204px;
  margin-left:auto;
}

.lk{
  position:relative;
  width:30px;
  height:30px;
  border-radius:9px;
  display:grid;
  place-items:center;
  transition:.18s;
}

.lk svg{width:16px;height:16px}
.lk-site{background:var(--coral);color:#fff;box-shadow:0 4px 12px rgba(232,96,122,.3)}
.lk-site:hover{background:var(--coral-dark,var(--coral));transform:translateY(-2px)}
.soc{background:var(--bg-alt);color:var(--ink-40)}
.soc:hover{color:var(--coral-dark,var(--coral));background:var(--coral-soft)}
.lk-compare{border:1px solid var(--line);background:#fff;color:var(--ink-40);cursor:pointer}
.lk-compare:hover{border-color:var(--coral);background:var(--coral-soft);color:var(--coral-dark,var(--coral));transform:translateY(-2px)}

.compare-toast{
  position:fixed;z-index:80;right:22px;bottom:22px;display:flex;align-items:center;gap:14px;max-width:min(440px,calc(100vw - 32px));
  padding:14px 15px 14px 17px;border:1px solid rgba(232,96,122,.18);border-radius:16px;background:rgba(255,255,255,.96);box-shadow:0 18px 46px rgba(24,24,34,.16);backdrop-filter:blur(18px);
  opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity .22s ease,transform .22s ease
}
.compare-toast.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.compare-toast-copy{display:grid;gap:2px;min-width:0}
.compare-toast-copy strong{color:var(--ink);font-size:.82rem;font-weight:650;line-height:1.25}
.compare-toast-copy span{color:var(--ink-60);font-size:.75rem;line-height:1.35}
.compare-toast-open{display:inline-flex;align-items:center;gap:5px;flex:none;color:var(--coral-dark,var(--coral));font-size:.75rem;font-weight:650;white-space:nowrap}
.compare-toast-close{display:grid;place-items:center;flex:none;width:26px;height:26px;border:0;border-radius:50%;background:var(--bg-alt);color:var(--ink-40);font-size:1rem;cursor:pointer}
.compare-toast-close:hover{background:var(--coral-soft);color:var(--coral-dark,var(--coral))}

.mcards,
.agency-mobile-list{
  display:none;
  flex-direction:column;
  gap:12px;
}

.mcard,
.agency-mobile-card{
  border:1px solid var(--line);
  border-radius:var(--radius,16px);
  padding:15px;
  background:#fff;
  box-shadow:var(--shadow,var(--shadow-soft,0 18px 50px rgba(20,20,30,.08)));
}

.mcard-top,
.agency-mobile-top{
  display:flex;
  align-items:center;
  gap:11px;
}

.mcard-top .rank,
.agency-mobile-top .rank{flex:none}

.mcard .ava,
.agency-mobile-card .agency-avatar{width:38px;height:38px}

.mc-country{font-size:.8rem;color:var(--ink-40)}

.mc-tag,
.agency-mobile-card p{
  font-size:.85rem;
  color:var(--ink-60);
  margin:11px 0 0;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.mcard .strength-icons,
.agency-mobile-card .strength-row{
  flex-wrap:wrap;
  margin:13px 0;
}

.mcard .adv-row{flex-wrap:wrap;margin:13px 0}

.mc-links,
.mobile-card-actions{
  display:flex;
  align-items:center;
  gap:8px;
  border-top:1px solid var(--line);
  padding-top:12px;
}

.mc-links .lk,
.mobile-card-actions .lk{width:38px;height:38px}

@media (max-width:1040px){
  .tablecard.agency-table-card,
  .agency-table-wrap{display:none}
  .mcards,
  .agency-mobile-list{display:flex}
}

@media (max-width:760px){
  .atag,
  .agency-table-tagline{max-width:100%}
  .compare-toast{right:12px;bottom:max(12px,env(safe-area-inset-bottom));left:12px;max-width:none;padding:13px 12px 13px 14px}
  .compare-toast-open{font-size:.72rem}
}