/* ===== GTS Certificate front-end (cleaned) ===== */

/* Core container */
.gts-cert-container, .gts-cert-wrapper{
  box-sizing:border-box;
  max-width:1100px;
  margin:0 auto;
  padding:24px 16px;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";
  line-height:1.55;
}

/* Meta text helpers (used in archive/search details) */
.gts-cert-number,.gts-cert-name,.gts-cert-valid{ margin:0; }

/* Badges (archive/search) */
.gts-badge-wrap{ display:flex; gap:.5rem .6rem; align-items:center; flex-wrap:wrap; }
.gts-badge{ display:inline-block; font-size:12px; line-height:1; padding:6px 8px; border-radius:999px; border:1px solid rgba(0,0,0,.08); background:#f3f3f3; font-weight:700; }
.gts-badge-expired{ background:#fee2e2; border-color:#fecaca; color:#991b1b; }
.gts-badge-valid{ background:#dcfce7; border-color:#bbf7d0; color:#166534; }
.gts-expiry-text,.gts-expiry-left{ font-size:12px; opacity:.85; }

/* Certificate frames & image caps (shared) */
.gts-cert-image,.gts-cert-image-frame img,.gts-cert-thumb-frame img{ width:100%; height:auto; display:block; }
.gts-cert-image-frame,.gts-cert-thumb-frame{
  position:relative;
  border:8px solid #f5f5f5;
  border-radius:16px;
  padding:8px;
  background:#fff;
  box-shadow:0 2px 12px rgba(0,0,0,.08), inset 0 0 0 1px rgba(0,0,0,.03);
  display:inline-block;
  width:100%;
  max-width:250px; /* cap certificate width */
}

/* Watermark (archive/search only) */
.gts-watermark-host{ position:relative; }
.gts-watermark{
  position:absolute; top:10px; right:10px;
  font-weight:900; font-size:14px; letter-spacing:1px;
  padding:.35em .6em; border-radius:999px; opacity:.95;
  user-select:none; white-space:nowrap; pointer-events:none;
  box-shadow:0 1px 2px rgba(0,0,0,.08); border:1px solid rgba(0,0,0,.06);
}
.gts-watermark-expired{ color:#7f1d1d; background:#fecaca; border-color:#fca5a5; }
.gts-watermark-valid{ color:#14532d; background:#bbf7d0; border-color:#86efac; }
.gts-watermark--thumb{ font-size:12px; }

/* Archive grid & cards */
.gts-cert-archive-header{ padding:0 0 8px 0; display:grid; gap:.75rem; }
.gts-cert-archive-filter{ display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
.gts-cert-archive-filter button{ padding:.5rem .8rem; border:1px solid #ddd; border-radius:8px; background:#f9f9f9; cursor:pointer; }
.gts-cert-archive-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.gts-cert-archive-card{ display:block; border:1px solid #eee; border-radius:12px; overflow:hidden; text-decoration:none; color:inherit; background:#fff; }
.gts-card-top,.gts-card-bottom{ display:flex; justify-content:center; align-items:flex-start; text-align:left; }
.gts-card-top{ gap:16px; padding:10px 10px 0 10px; flex-wrap:wrap; }
.gts-card-top .gts-card-details{ min-width:220px; max-width:500px; }
.gts-card-bottom{ padding:10px; }

/* Search components */
.gts-cert-search{ padding:16px; border:1px solid #eee; border-radius:12px; background:#fff; }
.gts-cert-search-form{ display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
.gts-cert-search-form input[type="text"]{ flex:1; min-width:260px; padding:.6rem .8rem; border:1px solid #ddd; border-radius:8px; outline:none; }
.gts-cert-search-form button{ padding:.6rem 1rem; border-radius:8px; border:1px solid #ddd; cursor:pointer; background:#f9f9f9; }
.gts-cert-card{ display:block; border:1px solid #eee; border-radius:12px; text-decoration:none; color:inherit; margin-top:12px; background:#fff; }
.gts-card-title{ font-weight:700; margin:0 0 6px 0; }
.gts-card-meta{ display:grid; gap:4px; font-size:.95rem; }
.gts-cert-invalid{ color:#c00; font-weight:600; }

/* -------- New single page layout (per mock), theme-color friendly -------- */
.gts-dark-panel{ background:transparent; color:inherit; max-width:900px; }
.gts-dark-panel a{ color:inherit; }

/* Grid: left | divider | right */
.gts-flex-wrap{
  display:grid;
  grid-template-columns:1fr 16px 2fr;
  gap:24px;
  align-items:start;
}
@media (max-width:900px){
  .gts-flex-wrap{ grid-template-columns:1fr; }
  .gts-divider{ display:none; }
}

/* Headings */
.gts-left .gts-heading,.gts-right .gts-heading{ font-weight:800; font-size:22px; margin:8px 0 12px;  text-align: center;}
.gts-heading-xl{ font-size:32px !important; }

/* Left column: details + photo */
.gts-section{ margin-bottom:28px; text-align: center;}
.gts-details{ display:grid; gap:8px; font-size:16px; }
.gts-cert-photo{ max-width:150px; width:100%; height:auto; border-radius:10px; display:block; margin: auto;}

/* Center dashed divider (use theme color softly) */
.gts-divider{ height:100%; border-right:3px dashed currentColor; opacity:.25; }

/* Right column: certificate + share */
.gts-right .gts-cert-image-frame{ display:block; margin:0 auto 16px; }
.gts-right .gts-cert-image{ width:100%; height:auto; display:block; border-radius:10px; }

.gts-share-stack{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; margin:0 auto;
}
.gts-share-label{ margin-top:4px; margin-bottom:8px; letter-spacing:1px; font-weight:700; font-size:.9rem; }
.gts-share-icons{ display:flex; gap:18px; align-items:center; justify-content:center; }
.gts-ico{ color:currentColor; opacity:.9; display:inline-flex; }
.gts-ico:hover{ opacity:1; }

/* Hide watermark on single page only */
.single-gts_certificate .gts-watermark{ display:none !important; }
