/* Front-end defaults + CSS variables */
.wptc-wrap{
  --wptc-font-family: inherit;
  --wptc-font-size: 16px;
  --wptc-line-height: 1.5;
  --wptc-text-color: #111827;
  --wptc-muted-color: #6b7280;
  --wptc-link-color: #2563eb;
  --wptc-link-hover: #1d4ed8;

  --wptc-bg: #ffffff;
  --wptc-header-bg: #f9fafb;
  --wptc-firstcol-bg: #fcfcfd;
  --wptc-zebra-bg: #f9fafb;
  --wptc-border: #e5e7eb;
  --wptc-radius: 16px;
  --wptc-shadow: 0 10px 25px rgba(0,0,0,.08);

  --wptc-hover-row: rgba(37,99,235,.06);
  --wptc-hover-col: rgba(16,185,129,.06);

  --wptc-btn-bg: #111827;
  --wptc-btn-text: #ffffff;
  --wptc-btn-hover: #000000;

  --wptc-highlight-bg: rgba(245, 158, 11, .08);
  --wptc-highlight-border: #f59e0b;

  font-family: var(--wptc-font-family);
  color: var(--wptc-text-color);
}

.wptc-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  background: var(--wptc-bg);
  border:1px solid var(--wptc-border);
  border-radius: var(--wptc-radius);
  overflow:hidden;
  box-shadow: var(--wptc-shadow);
}
.wptc-table th, .wptc-table td{
  border-right:1px solid var(--wptc-border);
  border-bottom:1px solid var(--wptc-border);
  padding:14px;
  vertical-align:top;
  background:#fff;
}
.wptc-table tr:last-child td, .wptc-table tr:last-child th{ border-bottom:0; }
.wptc-table td:last-child, .wptc-table th:last-child{ border-right:0; }
.wptc-table th{
  background: var(--wptc-header-bg);
  font-weight: 900;
}
.wptc-table .wptc-sticky-col{
  position:sticky; left:0; z-index:2;
  background: var(--wptc-firstcol-bg);
}
.wptc-wrap.wptc-sticky-header .wptc-table tr:first-child th{
  position: sticky; top:0; z-index:3;
}
.wptc-wrap.wptc-hover-row .wptc-table tr:hover > *{
  background: var(--wptc-hover-row);
}
.wptc-wrap.wptc-hover-cell .wptc-table td:hover, .wptc-wrap.wptc-hover-cell .wptc-table th:hover{
  filter: brightness(.98);
}
.wptc-highlight-col{
  background: var(--wptc-highlight-bg) !important;
  box-shadow: inset 0 0 0 2px var(--wptc-highlight-border);
}
.wptc-caption{ padding:10px; font-weight:800; text-align:left; }
.wptc-caption-small{ font-size:12px; color: var(--wptc-muted-color); margin-top:6px; }

.wptc-btn{
  display:inline-block;
  padding:10px 14px;
  border-radius: 12px;
  text-decoration:none;
  font-weight:900;
  background: var(--wptc-btn-bg);
  color: var(--wptc-btn-text);
}
.wptc-btn:hover{ background: var(--wptc-btn-hover); color: var(--wptc-btn-text); }

.wptc-badge{
  display:inline-block;
  padding:4px 10px;
  border-radius: 999px;
  font-weight:900;
  font-size:12px;
}
.wptc-badge-gold{ background:#f59e0b; color:#111827; }
.wptc-badge-blue{ background:#2563eb; color:#fff; }
.wptc-badge-green{ background:#10b981; color:#062a20; }

.wptc-ribbon{
  display:inline-block;
  padding:6px 10px;
  border-radius: 10px;
  background:#111827;
  color:#fff;
  font-weight:900;
  margin-bottom:8px;
}

.wptc-tip{
  display:inline-grid;
  place-items:center;
  width:18px; height:18px;
  border-radius:999px;
  background:#e5e7eb;
  color:#111827;
  font-weight:900;
  margin-left:6px;
  cursor:help;
  font-size:12px;
}
.wptc-tooltip{
  position:absolute;
  z-index:9999;
  background:#111827;
  color:#fff;
  padding:8px 10px;
  border-radius:10px;
  max-width:260px;
  font-size:12px;
  line-height:1.4;
}

.wptc-view-toggle{ display:flex; gap:8px; margin:10px 0; }
.wptc-toggle-btn{
  border:1px solid var(--wptc-border);
  background:#f9fafb;
  padding:8px 12px;
  border-radius:999px;
  cursor:pointer;
  font-weight:800;
}
.wptc-toggle-btn.is-active{
  background:#111827;
  color:#fff;
  border-color:#111827;
}

.wptc-view{ display:block; }
.wptc-view-cards{ display:none; }

.wptc-wrap.wptc-default-cards .wptc-view-cards{ display:block; }
.wptc-wrap.wptc-default-cards .wptc-view-table{ display:none; }
.wptc-wrap.wptc-default-table .wptc-view-cards{ display:none; }
.wptc-wrap.wptc-default-table .wptc-view-table{ display:block; }

.wptc-cards{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:12px;
}
.wptc-card{
  border:1px solid var(--wptc-border);
  border-radius: var(--wptc-radius);
  padding:12px;
  background:#fff;
  box-shadow: var(--wptc-shadow);
}
.wptc-card-highlight{
  box-shadow: 0 12px 30px rgba(245, 158, 11, .18);
  border-color: var(--wptc-highlight-border);
}
.wptc-card-title{ margin:8px 0 10px; font-size:18px; }
.wptc-card-row{ display:grid; grid-template-columns: 1fr 1fr; gap:10px; padding:10px 0; border-bottom:1px solid var(--wptc-border); }
.wptc-card-row:last-child{ border-bottom:0; }
.wptc-card-label{ font-weight:900; color: var(--wptc-muted-color); }
.wptc-card-value{ font-weight:600; }

.wptc-list{ padding-left:18px; margin:0; }
.wptc-proscons{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.wptc-proscons ul{ margin:6px 0 0; padding-left:18px; }

.wptc-yn{ font-weight:900; padding:4px 10px; border-radius:999px; display:inline-block; font-size:12px; }
.wptc-yn-yes{ background:#ecfdf5; color:#065f46; }
.wptc-yn-no{ background:#fef2f2; color:#991b1b; }
.wptc-yn-partial{ background:#fffbeb; color:#92400e; }

.wptc-progress{ border:1px solid var(--wptc-border); border-radius:999px; overflow:hidden; height:10px; background:#f9fafb; }
.wptc-progress span{ display:block; height:10px; background:#111827; }

.wptc-circlewrap{ display:inline-flex; flex-direction:column; align-items:flex-start; gap:6px; }
.wptc-circle{
  width:56px; height:56px; border-radius:999px;
  display:grid; place-items:center;
  background:#111827; color:#fff; font-weight:900;
}

/* Responsive behavior + toggle */
@media (max-width: 768px){
  .wptc-cards{ grid-template-columns: 1fr; }
  .wptc-table{ display:block; overflow-x:auto; }
}

/* Conditional formatting classes */
.wptc-rule-good { background: #ecfdf5 !important; }
.wptc-rule-warn { background: #fffbeb !important; }
.wptc-rule-bad { background: #fef2f2 !important; }
.wptc-rule-highlight { outline: 2px solid var(--wptc-highlight-border) !important; outline-offset: -2px; }


/* Icon / styled list / text+icon */
.wptc-icon-wrap{ display:inline-flex; align-items:center; gap:8px; justify-content:center; }
.wptc-icon{ font-weight:900; font-size:18px; }
.wptc-icon-label{ font-weight:700; }
.wptc-texticon{ display:flex; align-items:center; gap:8px; }
.wptc-texticon-ic{ font-size:16px; }
.wptc-styled-list{ list-style:none; margin:0; padding:0; display:grid; gap:6px; }
.wptc-styled-list li{ display:flex; align-items:flex-start; gap:8px; }
.wptc-styled-list-ic{ font-weight:900; }
