/* Grid of license cards — theme-friendly */
:root{
  --ptlc-primary: var(--primary-color, #2f6bff);
  --ptlc-text: #1d2433;
  --ptlc-muted: var(--text-muted, #6c757d);
  --ptlc-bg: var(--bg-body, #fff);
  --ptlc-border: var(--border-color, #e9eef5);
  --ptlc-radius: var(--border-radius, 16px);
}
.ptlc-grid{ display:grid; gap:24px; grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width: 991.98px){ .ptlc-grid{ grid-template-columns:1fr; } }
@media (min-width:576px) and (max-width:991.98px){ .ptlc-grid{ grid-template-columns:repeat(2,1fr);} }

.ptlc-card{
  background:var(--ptlc-bg); border:1px solid var(--ptlc-border); border-radius:var(--ptlc-radius);
  padding:24px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:12px;
  transition:.2s ease; box-shadow:0 6px 20px rgba(47,107,255,.06);
}
.ptlc-card:hover{ transform:translateY(-2px); box-shadow:0 18px 40px rgba(47,107,255,.08) }

/* Product image constraints */
.ptlc-img{ width:auto; max-width:220px; max-height:64px; object-fit:contain; display:block }

.ptlc-title{ font-weight:900; font-size:20px; color:var(--ptlc-primary) }

.ptlc-price{ display:flex; flex-direction:column; align-items:center; gap:6px; margin:4px 0 2px }
.ptlc-number{ font-size:26px; font-weight:900; color:var(--ptlc-primary) }
.ptlc-unit{ font-size:13px; color:var(--ptlc-muted) }

/* Select styling (improved) */
.ptlc-select-wrap{ display:flex; align-items:center; gap:10px; }
.ptlc-select-label{ font-size:13px; color:var(--ptlc-muted) }
.ptlc-select-ui{ position:relative }
.ptlc-select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  border:1px solid var(--ptlc-border); background:#fff;
  padding:8px 36px 8px 12px; border-radius:12px; font-size:14px;
}
.ptlc-select-ui:after{
  content:''; position:absolute; right:10px; top:50%; width:0; height:0; pointer-events:none;
  border-left:6px solid transparent; border-right:6px solid transparent; border-top:6px solid var(--ptlc-primary);
  transform:translateY(-25%);
}

/* Button + features */
.ptlc-btn{
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:700; font-size:14px; padding:10px 16px; border-radius:12px;
  text-decoration:none; color:#fff; background:var(--ptlc-primary);
}
.ptlc-btn:hover{ opacity:.95 }
.ptlc-features{ list-style:none; padding:0; margin:10px 0 0; text-align:right; width:100%; max-width:360px }
.ptlc-features li{ position:relative; padding-right:18px; margin:6px 0; color:#334 }
.ptlc-features li:before{ content:''; position:absolute; right:0; top:.55em; width:8px; height:8px; border-radius:50%; background:var(--ptlc-primary) }

/* === v2.0.1 Responsive tweaks === */
@media (max-width: 575.98px){
  .ptlc-grid{ grid-template-columns: 1fr; justify-content:center; gap:16px; }
  .ptlc-card{ max-width: 520px; width: 100%; padding:16px; border-radius:14px; }
  .ptlc-img{ max-width: 160px; max-height: 56px; }
  .ptlc-select-wrap{ flex-wrap: wrap; justify-content:center; gap:8px 10px; }
  .ptlc-select{ width: 100%; min-width: 220px; }
  .ptlc-btn{ width: 100%; }
  .ptlc-features{ max-width: 100%; }
}
.ptlc-card, .ptlc-select, .ptlc-btn { max-width: 100%; }

/* === v2.0.2 Centering & robust responsive === */
.ptlc-grid{
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  justify-content: center !important;   /* center tracks */
  justify-items: center !important;     /* center items within tracks */
  align-items: stretch;
  gap: 20px;
}
.ptlc-card{
  width: 100%;
  max-width: 360px;                     /* keeps cards narrow and centerable */
  margin-inline: auto;                  /* failsafe centering */
}
/* Prevent dropdown & button from overflowing */
.ptlc-select, .ptlc-btn{ max-width: 100%; }
/* Tighter mobile */
@media (max-width: 575.98px){
  .ptlc-grid{ grid-template-columns: 1fr !important; gap: 16px; }
  .ptlc-card{ max-width: 520px; width: 100%; padding: 16px; }
  .ptlc-img{ max-width: 160px; max-height: 56px; }
  .ptlc-select-wrap{ flex-wrap: wrap; justify-content: center; gap: 8px 10px; width: 100%; }
  .ptlc-select{ width: 100%; min-width: 0; }
  .ptlc-btn{ width: 100%; }
  .ptlc-features{ max-width: 100%; }
}

/* === v2.0.3 Centering + breakpoints === */
.ptlc-grid{
  margin-inline:auto;
  max-width: 1200px;                /* keep content centered with a container width */
  grid-template-columns: repeat(3, minmax(300px, 1fr)) !important;
  justify-content: center !important;
  justify-items: center !important;
  gap: 24px;
}
/* 2 columns on tablets/medium screens */
@media (max-width: 1199.98px){
  .ptlc-grid{ grid-template-columns: repeat(2, minmax(300px, 1fr)) !important; }
}
/* 1 column on mobiles */
@media (max-width: 767.98px){
  .ptlc-grid{ grid-template-columns: 1fr !important; gap: 16px; }
  .ptlc-card{ padding:16px; }
}
.ptlc-card{
  width: 100%;
  max-width: 420px;                 /* wider card so content breathes */
  margin-inline:auto;
}
.ptlc-select, .ptlc-btn{ max-width: 100%; }