@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Montserrat:wght@400;500;600;700;800;900&family=Dancing+Script:wght@600;700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@700&display=swap');


:root {
  --hot-pink: #E91E8C;
  --deep-pink: #C2186F;
  --blue: #1A4FBA;
  --mid-blue: #1E5FD8;
  --light-blue: #5BC8F5;
  --dark-blue: #0D2F78;
  --white: #FFFFFF;
  --text-dark: #0D1B4B;
  --card-w: 8.6cm;
  --card-h: 5.5cm;
}



/* ── CARD SHELL ─────────────────────────────── */
.ggp-card {
  width: var(--card-w);
  height: var(--card-h);
  background: var(--white);
  border-radius: 5px;
  overflow: hidden;
  position: relative;
  box-shadow:
    0 0 0 1.5px #dde0ec,
    0 10px 36px rgba(0,0,0,0.20),
    0 2px 8px rgba(0,0,0,0.10);
  display: flex;
  flex-direction: column;
  margin: 0 auto;
}



/* ── TOP COLOUR BAR ─────────────────────────── */
/* .ggp-topbar {
  width: 100%;
  height: 2.5px;
  background: linear-gradient(90deg,
    var(--hot-pink) 0%,
    #8B2FC9 35%,
    var(--blue) 65%,
    var(--light-blue) 100%);
  flex-shrink: 0;
} */
.ggp-topbar {
  width: 100%;
  height: 2.5px;
  background: #C98B14;
  flex-shrink: 0;
}

/* ── HEADER ─────────────────────────────────── */
.ggp-header {
  display: flex;
  align-items: center;
  padding: 5px 9px 3px 8px;
  gap: 7px;
  flex-shrink: 0;
}

.ggp-logo {
  width: 44px;
  height: 44px;
  object-fit: contain;
  flex-shrink: 0;
}


.ggp-brand {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.5px;
}

.ggp-brand__name {
    font-weight: 900;
    font-size: 27px;
    line-height: 1;
    letter-spacing: 0.8px;
    color:#e91e8c;

    font-family: 'Oswald', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    /* letter-spacing: 1px; */
    /* transform: scaleX(1.3); */
    transform-origin: left center;
    display: inline-block;
}

.ggp-brand__name sup {
    font-size: 7.5px;
    font-weight: 800;
    -webkit-text-fill-color: #000000;
    vertical-align: super;
    line-height: 0;
}

.ggp-brand__tagline {
  font-size: 6.2px;
  font-weight: 600;
  color: #000000;
  letter-spacing: 0.3px;
  display: flex;
  align-items: center;
  gap: 5px;
}

.ggp-brand__tagline-line {
  display: inline-block;
  width: 14px;
  height: 0.9px;
  background: var(--hot-pink);
  border-radius: 1px;
}

.ggp-brand__address {
  font-size: 5.8px;
  font-weight: 500;
  color: #000000;
  display: flex;
  align-items: center;
  gap: 3px;
}

/* ── CERTIFICATE RIBBON (SVG) ───────────────── */
.ggp-ribbon-area {
  width: 100%;
  flex-shrink: 0;
  padding: 0 7px;
  margin-bottom: 3px;
  background-image: url('./logocertbg.png');
  background-size: contain;
}

.ggp-ribbon-svg {
  width: 100%;
  height: 20px;
  display: block;
  overflow: visible;
}

/* ── MAIN BODY ──────────────────────────────── */
.ggp-body {
  flex: 1;
  display: flex;
  padding: 0 8px;
  gap: 0;
  position: relative;
  /* overflow: hidden; */
}

/* Watermark */
.ggp-watermark {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100px;
  height: 80px;
  object-fit: contain;
  opacity: 0.16;
  pointer-events: none;
  z-index: 0;
}

/* ── DETAILS TABLE ──────────────────────────── */
.ggp-details {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
    z-index: 1;
    padding-top: 1px;
    padding-left: 9px;
}


.ggp-row {
    display: flex;
    align-items: baseline;
    gap: 3px;
    padding: 1px 0;
}

.ggp-row--divider {
  border-top: 0.8px dashed #C6861B;
  margin-top: 2px;
  /* padding-top: 3px; */
}

.ggp-row__label {
  font-size: 6.9px;
  font-weight: 800;
  /* color: var(--blue); */
  color: #C82059;
  min-width: 68px;
  flex-shrink: 0;
  line-height: 1.3;
}

.ggp-row--divider .ggp-row__value {
  color: #C6861B;
}

.ggp-row__label--sm {
  font-size: 6.3px;
}

.ggp-row__colon {
  font-size: 5.9px;
  color: #555;
  flex-shrink: 0;
}

.ggp-row__value {
  font-size: 6.9px;
  font-weight: 500;
  color: #000000;
  line-height: 1.3;
}

.ggp-row__value--bold {
  font-weight: 700;
}

.ggp-row__value--pink {
    /* color: var(--hot-pink); */
    /* font-weight: 800; */
    font-size: 6.3px;
    /* text-transform: uppercase; */
    /* letter-spacing: 0.3px; */
}

.ggp-row__value--total {
  font-weight: 700;
}

/* ── GEM PANEL ──────────────────────────────── */
.ggp-gem-panel {
  width: 76px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding-left: 5px;
  position: relative;
  z-index: 1;
  padding-top: 1px;
}

.ggp-gem-frame {
  width: 68px;
  height: 52px;
  /* border: 1.5px solid var(--hot-pink); */
  border: 1.5px double #C98B14;
  border-radius: 4px;
  overflow: hidden;
  background: linear-gradient(145deg, #eef2ff 0%, #dce8ff 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 1px 4px rgba(26,79,186,0.08);
}

.ggp-gem-img {
  width: 62px;
  height: 50px;
  object-fit: contain;
}

.ggp-gem-label {
  width: 100%;
  background: linear-gradient(90deg, var(--hot-pink) 0%, var(--blue) 100%);
  color: var(--white);
  font-size: 5px;
  font-weight: 800;
  letter-spacing: 0.6px;
  text-align: center;
  padding: 2.5px 3px;
  border-radius: 2px;
  text-transform: uppercase;
}

/* ── BADGES ─────────────────────────────────── */
.ggp-badges {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 3px 10px 4px;
  border-top: 0.8px solid #e4e7f4;
  margin: 2px 8px 0;
}

.ggp-badge {
  display: flex;
  /* flex-direction: column; */
  align-items: center;
  gap: 2px;
  flex: 1;
  position: relative;
}

.ggp-badge:not(:last-child)::after {
  content: '';
  position: absolute;
  right: 0;
  top: 3px;
  height: 65%;
  width: 0.8px;
  background: #dde0f0;
}

.ggp-badge__icon {
  width: 14px;
  height: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ggp-badge__icon svg {
  width: 100%;
  height: 100%;
}

.ggp-badge__text {
  font-size: 4.7px;
  font-weight: 600;
  color: #3a3a3a;
  text-align: center;
  line-height: 1.3;
}

/* ── BOTTOM GRADIENT BAR ─────────────────────── */
.ggp-footer {
  width: 100%;
  height: 14px;
  /* background: linear-gradient(90deg,
    var(--hot-pink) 0%,
    #8B2FC9 30%,
    var(--blue) 65%,
    var(--dark-blue) 100%); */
  background: #C6861B;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}

.ggp-footer__text {
    font-family: 'Dancing Script', cursive;
    font-size: 8.5px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.92);
    letter-spacing: 0px;
    font-style: italic;
}






/* ── Force all colors/backgrounds to print exactly ── */
@media print {
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        color-adjust: exact !important;
    }
}