/* GC Gallery styles (scoped) */
.gcg-scope { --gc-gap: 1rem; }
.gcg-scope .gcg-h1{ font-size: clamp(1.25rem, 4.5vw, 1.75rem); margin:.25rem 0 .75rem; color:#0f172a; text-align:center; }

/* Alerts */
.gcg-scope .gc-alert{ padding:.75rem 1rem; border-radius:.5rem; margin:.75rem auto; max-width: 680px; }
.gcg-scope .gc-alert.success{ background:#ecfdf5; color:#065f46; border:1px solid #a7f3d0; }
.gcg-scope .gc-alert.error{ background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }

/* Form */
.gcg-scope .gcg-form{ max-width:680px; margin: 0 auto 1rem; gap:.75rem; padding: 0 .75rem; }
.gcg-scope .gcg-form label{ gap:.3rem; font-weight:600; color:#111827; }
.gcg-scope .gcg-form input[type="text"],
.gcg-scope .gcg-form input[type="password"],
.gcg-scope .gcg-form textarea{ padding:.6rem .7rem; border:1px solid #d9dee3; border-radius:.5rem; }
.gcg-scope .gcg-form input[type="file"]{ padding:.45rem; border:1px dashed #d1d5db; background:#fafafa; border-radius:.5rem; width: 100%;}
.gcg-scope .gcg-form input, .gcg-scope .gcg-form textarea {margin-bottom: 15px;}
.gcg-scope .gcg-btn{
  width:100%; min-height:48px; border:0; border-radius:.75rem; padding:.9rem 1rem; font-weight:700; font-size:1rem;
  color:#fff; background: linear-gradient(135deg,#0ea5e9,#2563eb); box-shadow: 0 8px 20px rgba(37,99,235,.25);
  cursor:pointer; transition: transform .06s ease, filter .15s ease, box-shadow .15s ease;
}
.gcg-scope .gcg-btn:hover{ filter:brightness(.98); box-shadow: 0 10px 24px rgba(37,99,235,.28); }
.gcg-scope .gcg-btn:active{ transform: translateY(1px) scale(.998); }
.gcg-scope .gcg-note{ font-size:.85rem; color:#6b7280; text-align:center; }

/* Grid cards */
.gcg-scope .gcg-grid{ display:grid; grid-template-columns: 1fr; gap:1rem; }
@media (min-width: 640px){ .gcg-scope .gcg-grid{ grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px){ .gcg-scope .gcg-grid{ grid-template-columns: repeat(3,1fr); } }

.gcg-scope .gcg-card{
  background:#fff; border:1px solid #eef2f7; border-radius:1rem; overflow:hidden;
  box-shadow: 0 10px 30px rgba(2,6,23,.06); display:flex; flex-direction:column; gap:.65rem;
}
.gcg-scope .gcg-media{ aspect-ratio: 16/9; background:#f3f4f6; }
.gcg-scope img.gcg-img{ width:100%; height:100%; object-fit:cover; display:block; }
.gcg-scope .gcg-body{ padding:1rem; }
.gcg-scope .gcg-title{ font-size:1rem; color:#0f172a; margin:0 0 .25rem; }
.gcg-scope .gcg-text{ color:#111827; }

/* Pagination */
.gcg-scope .gcg-pagination{ margin: .75rem 0; display:flex; justify-content:center; }
.gcg-scope .gcg-pagination ul{ list-style:none; padding:0; display:flex; gap:.4rem; flex-wrap:wrap; }
.gcg-scope .gcg-pagination a, .gcg-scope .gcg-pagination span{
  display:inline-block; padding:.4rem .6rem; border:1px solid #e5e7eb; border-radius:.5rem; text-decoration:none;
}
.gcg-scope .gcg-pagination .current{ background:#0ea5e9; color:#fff; border-color:#0ea5e9; }

.req{ color:#ef4444; }

/* v1.1.0: Lightbox responsive */
.gcg-scope .gcg-lightbox{
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(2,6,23,.8);
  display: none;
}
.gcg-scope .gcg-lightbox.is-open{ display: grid; place-items: center; }
.gcg-scope .gcg-lightbox-dialog{
  position: relative; max-width: 95vw; max-height: 90vh;
  display: grid; place-items: center;
  outline: none;
}
.gcg-scope .gcg-lightbox-img{
  max-width: 95vw; max-height: 85vh; width: auto; height: auto; object-fit: contain; display: block;
  border-radius: .5rem; box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
.gcg-scope .gcg-lightbox-close,
.gcg-scope .gcg-lightbox-prev,
.gcg-scope .gcg-lightbox-next{
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 999px; border: 0; cursor: pointer;
  background: rgba(15,23,42,.9); color: #fff; font-size: 18px; line-height: 44px; text-align: center;
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
}
.gcg-scope .gcg-lightbox-prev{ left: 1rem; }
.gcg-scope .gcg-lightbox-next{ right: 1rem; }
.gcg-scope .gcg-lightbox-close{
  top: 1rem; right: 1rem; transform: none; width: 40px; height: 40px; line-height: 40px;
}
@media (max-width: 480px){
  .gcg-scope .gcg-lightbox-prev, .gcg-scope .gcg-lightbox-next{
    width: 40px; height: 40px; line-height: 40px;
  }
}
