/* File: css/layout.css */

/* ======================================================================== */
/* BLOK       : KONTAINER UTAMA & PEMBUNGKUS FLUID                          */
/* FUNGSI     : Mengatur pembungkus master aplikasi multi-device            */
/* ARAH/RUTE  : Membungkus seluruh elemen visual halaman publik             */
/* ======================================================================== */

#gta-master-panel {
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  position: relative;
  background-color: var(--gta-bg-canvas);
  overflow-x: hidden;
}

.gta-container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

.gta-container-narrow {
  width: 100%;
  max-width: 850px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* ======================================================================== */
/* BLOK       : HEADER ATAS DUAL-STATE SCROLL-MORPHING                      */
/* FUNGSI     : Bilah navigasi atas dinamis yang menyusut saat digulir      */
/* ARAH/RUTE  : Menempel pada bagian atas layar (position: sticky)          */
/* ======================================================================== */

.gta-header,
#my-sticky-header {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background-color: rgba(15, 23, 42, 0.92);
  backdrop-filter: var(--gta-glass-blur);
  -webkit-backdrop-filter: var(--gta-glass-blur);
  border-bottom: 1px solid var(--gta-border);
  transition: transform var(--gta-transition-normal), background-color var(--gta-transition-normal);
  padding: 10px 16px;
}

/* Baris Identitas Merek & Status Travel Hub */
.gta-sticky-brand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  transition: opacity var(--gta-transition-fast), transform var(--gta-transition-fast), max-height var(--gta-transition-fast);
}

.gta-logo-group {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.gta-logo-group img {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.gta-logo-title {
  font-size: 1.125rem;
  font-weight: 900;
  color: var(--gta-text-primary);
  letter-spacing: -0.03em;
  display: flex;
  align-items: center;
  gap: 4px;
}

.gta-logo-title span {
  color: var(--gta-cyan);
}

.gta-travel-hub-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--gta-radius-full);
  background-color: var(--gta-bg-panel);
  border: 1px solid var(--gta-border);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: var(--gta-text-primary);
}

/* Pembungkus Kolom Pencarian Universal */
.gta-search-bar-wrap {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
}

.gta-search-icon-fixed {
  position: absolute;
  left: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gta-text-secondary);
  pointer-events: none;
}

.gta-search-input {
  width: 100%;
  height: 42px;
  padding-left: 42px;
  padding-right: 14px;
  background-color: var(--gta-bg-container);
  border: 1px solid var(--gta-border);
  border-radius: var(--gta-radius-input);
  font-size: 13px;
  font-weight: 600;
  color: var(--gta-text-primary);
  outline: none;
  transition: border-color var(--gta-transition-fast), box-shadow var(--gta-transition-fast);
}

.gta-search-input:focus {
  border-color: var(--gta-cyan);
  box-shadow: 0 0 0 2px var(--gta-cyan-soft);
}

/* Keadaan Morphing Seluler Saat Digulir > 40px */
.gta-header.scrolled .gta-sticky-brand-row,
#my-sticky-header.scrolled .gta-sticky-brand-row {
  max-height: 0;
  opacity: 0;
  margin-bottom: 0;
  overflow: hidden;
  pointer-events: none;
  transform: translateY(-10px);
}

/* ======================================================================== */
/* BLOK       : SLIDER FLASH BANNER 16:9 & ROTATOR OTOMATIS                 */
/* FUNGSI     : Wadah rotasi banner hero promosi 5 slot                     */
/* ARAH/RUTE  : Menampilkan visual promosi di beranda dan travelog          */
/* ======================================================================== */

.gta-banner-viewport {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--gta-radius-card);
  overflow: hidden;
  border: 1px solid var(--gta-border);
  background-color: var(--gta-bg-container);
  cursor: pointer;
}

.gta-banner-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
}

.gta-banner-slide.active {
  opacity: 1;
  visibility: visible;
}

.gta-banner-gradient-mask {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(7, 13, 30, 0.1) 0%, rgba(7, 13, 30, 0.85) 80%, rgba(7, 13, 30, 0.98) 100%);
}

.gta-banner-content-box {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  z-index: 2;
}

.gta-banner-slot-dots {
  position: absolute;
  bottom: 10px;
  right: 16px;
  display: flex;
  align-items: center;
  gap: 5px;
  z-index: 3;
}

.gta-banner-dot {
  width: 6px;
  height: 6px;
  border-radius: var(--gta-radius-full);
  background-color: rgba(255, 255, 255, 0.35);
  transition: width var(--gta-transition-fast), background-color var(--gta-transition-fast);
}

.gta-banner-dot.active {
  width: 18px;
  background-color: var(--gta-cyan);
}

/* ======================================================================== */
/* BLOK       : GRID PILAR UTAMA & FILTER HORIZONTAL                        */
/* FUNGSI     : Kisi pilihan pilar layanan dan deretan pil scrollable       */
/* ARAH/RUTE  : Saringan kategori di beranda, explore, dan marketplace      */
/* ======================================================================== */

.gta-pillar-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  width: 100%;
}

.gta-pillar-grid-5 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  width: 100%;
}

.gta-pillar-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 12px 6px;
  border-radius: var(--gta-radius-btn);
  background-color: var(--gta-bg-container);
  border: 1px solid var(--gta-border);
  cursor: pointer;
  transition: all var(--gta-transition-fast);
}

.gta-pillar-card .pillar-icon-box {
  width: 36px;
  height: 36px;
  border-radius: var(--gta-radius-btn);
  background-color: var(--gta-bg-panel);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gta-cyan);
  transition: all var(--gta-transition-fast);
}

.gta-pillar-card span {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--gta-text-secondary);
}

.gta-pillar-card.active {
  border-color: var(--gta-cyan);
  background-color: var(--gta-cyan-soft);
  box-shadow: 0 0 12px rgba(0, 229, 255, 0.25);
}

.gta-pillar-card.active .pillar-icon-box {
  background-color: var(--gta-cyan);
  color: var(--gta-bg-canvas);
}

.gta-pillar-card.active span {
  color: var(--gta-cyan);
}

/* Bilah Geser Horizontal Tag dan Subkategori Bebas Scrollbar */
.gta-tag-scroll-list,
.gta-subcat-bar,
.gta-promo-grid {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  white-space: nowrap;
  padding-bottom: 4px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.gta-tag-scroll-list::-webkit-scrollbar,
.gta-subcat-bar::-webkit-scrollbar,
.gta-promo-grid::-webkit-scrollbar {
  display: none;
}

.gta-filter-pill-tag {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  border-radius: var(--gta-radius-full);
  background-color: var(--gta-bg-container);
  border: 1px solid var(--gta-border);
  font-size: 11px;
  font-weight: 700;
  color: var(--gta-text-secondary);
  cursor: pointer;
  transition: all var(--gta-transition-fast);
}

.gta-filter-pill-tag.active {
  background-color: var(--gta-accent-primary);
  border-color: var(--gta-accent-primary);
  color: var(--gta-bg-canvas);
  font-weight: 800;
}

/* Tile Promo Flashsale 24 Jam */
.gta-promo-tile {
  position: relative;
  flex: 0 0 110px;
  height: 70px;
  border-radius: var(--gta-radius-input);
  overflow: hidden;
  border: 1px solid var(--gta-border);
  cursor: pointer;
}

.gta-promo-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--gta-transition-fast);
}

.gta-promo-tile .promo-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 0%, rgba(7, 13, 30, 0.85) 100%);
  display: flex;
  align-items: flex-end;
  padding: 6px 8px;
}

.gta-promo-tile .promo-overlay span {
  font-size: 10px;
  font-weight: 900;
  color: var(--gta-text-primary);
  letter-spacing: 0.05em;
}

/* ======================================================================== */
/* BLOK       : GRID ASIMETRIS OFFSET (ASENSORIAL DUAL-COLUMN OFFSET GRID)  */
/* FUNGSI     : Tata letak katalog 2 kolom dengan kolom kanan turun 24px    */
/* ARAH/RUTE  : Halaman utama (index.html), explore, dan marketplace        */
/* ======================================================================== */

.gta-offset-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  width: 100%;
  align-items: start;
}

.gta-offset-col-left,
.gta-offset-col-right {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Kolom Kanan Turun 24px Sesuai Spesifikasi Desain */
.gta-offset-col-right {
  transform: translateY(24px);
}

/* ======================================================================== */
/* BLOK       : KARTU PRODUK KATALOG TERSTANDARISASI                        */
/* FUNGSI     : Membungkus foto 4:3, rincian harga, bintang, dan bookmark   */
/* ARAH/RUTE  : Kartu penawaran produk ke halaman detail produk             */
/* ======================================================================== */

.gta-product-card {
  display: flex;
  flex-direction: column;
  background-color: var(--gta-bg-container);
  border: 1px solid var(--gta-border);
  border-radius: var(--gta-radius-card);
  overflow: hidden;
  transition: transform var(--gta-transition-fast), border-color var(--gta-transition-fast), box-shadow var(--gta-transition-fast);
  cursor: pointer;
  position: relative;
}

.gta-product-card:hover {
  border-color: var(--gta-cyan);
  box-shadow: 0 4px 20px rgba(0, 229, 255, 0.15);
}

.gta-card-thumb-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background-color: var(--gta-bg-panel);
}

.gta-card-thumb-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--gta-transition-normal);
}

.gta-product-card:hover .gta-card-thumb-wrap img {
  transform: scale(1.05);
}

.gta-card-badge-pos {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
}

.gta-card-wish-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  width: 28px;
  height: 28px;
  border-radius: var(--gta-radius-full);
  background-color: rgba(7, 13, 30, 0.7);
  backdrop-filter: var(--gta-glass-blur);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gta-text-secondary);
  border: 1px solid var(--gta-border-subtle);
  transition: color var(--gta-transition-fast), transform var(--gta-transition-fast);
}

.gta-card-wish-btn.active {
  color: var(--gta-amber);
}

.gta-card-body {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.gta-card-meta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11px;
}

.gta-card-title {
  font-size: 0.8125rem;
  font-weight: 800;
  line-height: 1.35;
  color: var(--gta-text-primary);
}

.gta-card-price-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
}

.gta-card-price {
  font-family: var(--gta-font-mono);
  font-size: 0.875rem;
  font-weight: 800;
  color: var(--gta-emerald);
}

/* ======================================================================== */
/* BLOK       : ERGONOMI PEMBACA ARTIKEL & TRAVELOG (850PX MAKSIMAL)        */
/* FUNGSI     : Membatasi kolom membaca, garis progres baca, dan tipografi  */
/* ARAH/RUTE  : Halaman pages/article-detail.html                           */
/* ======================================================================== */

.gta-reader-wrapper {
  width: 100%;
  max-width: 850px;
  margin: 0 auto;
  padding: 20px 16px 80px 16px;
}

.gta-reading-progress-track {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background-color: transparent;
  z-index: 100;
}

.gta-reading-progress-bar {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--gta-cyan) 0%, var(--gta-purple) 100%);
  transition: width 0.1s ease-out;
}

.gta-article-body {
  font-size: 1rem;
  line-height: 1.85;
  color: var(--gta-text-body);
  margin-top: 24px;
}

.gta-article-body p {
  margin-bottom: 1.5rem;
  font-size: 1.0625rem;
  line-height: 1.85;
}

/* ======================================================================== */
/* BLOK       : FEED VIDEO VERTIKAL LAYAR PENUH (TRAVEL REEL 100VH)         */
/* FUNGSI     : Scroll-snapping feed video 9:16 latar belakang hitam murni  */
/* ARAH/RUTE  : Halaman pages/travel-reel.html                              */
/* ======================================================================== */

.gta-reel-viewport {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  background-color: var(--gta-bg-reel);
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.gta-reel-viewport::-webkit-scrollbar {
  display: none;
}

.gta-reel-item {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--gta-bg-reel);
  overflow: hidden;
}

.gta-reel-media {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gta-reel-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, transparent 40%, rgba(0, 0, 0, 0.85) 100%);
  pointer-events: none;
}

.gta-reel-actions-column {
  position: absolute;
  right: 14px;
  bottom: 110px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  z-index: 10;
}

.gta-reel-action-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: var(--gta-text-primary);
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.6));
}

.gta-reel-action-btn span {
  font-size: 10px;
  font-weight: 700;
}

.gta-reel-info-box {
  position: absolute;
  bottom: 80px;
  left: 16px;
  right: 70px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 10;
}

/* ======================================================================== */
/* BLOK       : MODAL LAYAR PENUH & BOTTOM SHEET DRAWER                     */
/* FUNGSI     : Kotak dialog, checkout wizard, reader, dan 3-tier selector  */
/* ARAH/RUTE  : Modal pop-up di atas seluruh hierarki visual                */
/* ======================================================================== */

.gta-full-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  background-color: var(--gta-bg-canvas);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--gta-transition-normal), visibility var(--gta-transition-normal);
}

.gta-full-modal.active {
  opacity: 1;
  visibility: visible;
}

.gta-modal-sticky-bar {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20;
  height: 54px;
  background-color: rgba(15, 23, 42, 0.95);
  backdrop-filter: var(--gta-glass-blur);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  border-bottom: 1px solid var(--gta-border);
}

.gta-modal-close-btn {
  width: 36px;
  height: 36px;
  border-radius: var(--gta-radius-btn);
  background-color: var(--gta-bg-panel);
  border: 1px solid var(--gta-border);
  color: var(--gta-text-primary);
  display: flex;
  align-items: center;
  justify-content: center;
}

.gta-modal-body-wrap {
  flex: 1;
  width: 100%;
  max-width: 850px;
  margin: 0 auto;
}

.gta-modal-bottom-dock {
  position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(15, 23, 42, 0.95);
  backdrop-filter: var(--gta-glass-blur);
  border-top: 1px solid var(--gta-border);
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 20;
}

/* ======================================================================== */
/* BLOK       : BILAH NAVIGASI MELAYANG TETAP (BOTTOM DOCK BAR < 1024PX)    */
/* FUNGSI     : Bilah navigasi 5 tombol dengan tombol tengah terangkat      */
/* ARAH/RUTE  : Menempel tetap di bagian bawah layar seluler                */
/* ======================================================================== */

.gta-bottom-nav {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 480px;
  height: 68px;
  background-color: rgba(15, 23, 42, 0.96);
  backdrop-filter: var(--gta-glass-dock-blur);
  -webkit-backdrop-filter: var(--gta-glass-dock-blur);
  border-top: 1px solid var(--gta-border);
  border-top-left-radius: var(--gta-radius-card);
  border-top-right-radius: var(--gta-radius-card);
  box-shadow: var(--gta-shadow-dock);
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 0 10px;
  z-index: 45;
}

.gta-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  color: var(--gta-text-secondary);
  font-size: 10px;
  font-weight: 700;
  flex: 1;
  height: 100%;
  transition: color var(--gta-transition-fast);
}

.gta-nav-item.active {
  color: var(--gta-cyan);
}

/* Tombol Tengah Terangkat (Travel Creator Hub / Booking Hub) */
.gta-nav-center-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  top: -14px;
}

.gta-booking-btn-raised,
.gta-nav-center-btn {
  width: 58px;
  height: 58px;
  border-radius: var(--gta-radius-full);
  background: linear-gradient(135deg, var(--gta-cyan) 0%, var(--gta-purple) 100%);
  border: 4px solid var(--gta-bg-canvas);
  box-shadow: 0 0 20px rgba(0, 229, 255, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform var(--gta-transition-fast), box-shadow var(--gta-transition-fast);
}

.gta-booking-btn-raised img,
.gta-nav-center-btn svg {
  width: 26px;
  height: 26px;
  object-fit: contain;
}

.gta-booking-btn-raised:active,
.gta-nav-center-btn:active {
  transform: scale(0.92);
}

.gta-booking-label-raised {
  font-size: 10px;
  font-weight: 800;
  color: var(--gta-text-primary);
  margin-top: 2px;
}

/* Tombol Melayang Kembali ke Atas (Back to Top FAB) */
.gta-back-top-btn {
  position: fixed;
  right: 16px;
  bottom: 84px;
  width: 42px;
  height: 42px;
  border-radius: var(--gta-radius-full);
  background-color: var(--gta-bg-container);
  border: 1px solid var(--gta-border);
  color: var(--gta-cyan);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--gta-shadow-md);
  z-index: 40;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--gta-transition-fast), visibility var(--gta-transition-fast), transform var(--gta-transition-fast);
}

.gta-back-top-btn.visible {
  opacity: 1;
  visibility: visible;
}

/* ======================================================================== */
/* BLOK       : KAKI HALAMAN UNIVERSAL (UNIVERSAL FOOTER)                   */
/* FUNGSI     : Informasi legalitas, kemitraan, dan bantalan bawah seluler  */
/* ARAH/RUTE  : Bagian terbawah setiap halaman publik                       */
/* ======================================================================== */

.gta-footer {
  width: 100%;
  background-color: var(--gta-bg-container);
  border-top: 1px solid var(--gta-border);
  padding: 32px 16px 115px 16px; /* Bantalan 115px agar tidak tertutup nav bawah */
  margin-top: 40px;
}

.gta-footer-grid {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* ======================================================================== */
/* BLOK       : STANDAR VIEWPORT LAYAR LEBAR / DESKTOP (>= 1024PX)          */
/* FUNGSI     : Mematikan navigasi bawah, mengaktifkan grid simetris 4 kolom */
/* ARAH/RUTE  : Media query untuk perangkat layar lebar                      */
/* ======================================================================== */

@media (min-width: 1024px) {
  .gta-container {
    max-width: 1200px;
    padding-left: 24px;
    padding-right: 24px;
  }

  /* Header Statis Layar Lebar 64px */
  .gta-header,
  #my-sticky-header {
    height: 64px;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .gta-sticky-brand-row {
    margin-bottom: 0;
    max-height: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .gta-search-bar-wrap {
    max-width: 480px;
  }

  /* Slider Hero Desktop Maksimal 420px */
  .gta-banner-viewport {
    aspect-ratio: auto;
    height: 380px;
  }

  /* Matikan Navigasi Bawah Mengambang Secara Mutlak di Desktop */
  .gta-bottom-nav {
    display: none !important;
  }

  /* Transisi Grid Asimetris Menjadi Grid Simetris Rata 4 Kolom di Desktop */
  .gta-offset-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
  }

  .gta-offset-col-right {
    transform: none; /* Netralkan penurunan 24px pada desktop */
  }

  /* Footer Bersih Tanpa Bantalan Bawah Navigasi */
  .gta-footer {
    padding-bottom: 40px;
  }

  .gta-footer-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
  }

  /* Modal Berubah Menjadi Pop-up Terpusat di Desktop */
  .gta-full-modal {
    align-items: center;
    justify-content: center;
    background-color: rgba(7, 13, 30, 0.85);
    backdrop-filter: var(--gta-glass-blur);
    padding: 30px;
  }

  .gta-full-modal > .gta-modal-body-wrap {
    background-color: var(--gta-bg-container);
    border: 1px solid var(--gta-border);
    border-radius: var(--gta-radius-sheet);
    overflow: hidden;
    max-height: 90vh;
    box-shadow: var(--gta-shadow-lg);
  }
}