/* Frontend styles */
.jg-places{
  --jg-radius: 20px;
  --jg-gap: 30px;
  /* 카드 그림자(기본형: Elementor 박스그림자 느낌) */
  --jg-card-shadow: 0 4px 30px rgba(0, 0, 0, 0.10);
  --jg-ic-size: 16px;
  --jg-title-size: 22px;
  --jg-title-weight: 600;
  --jg-title-color: #000;
  --jg-addr-size: 16px;
  --jg-addr-weight: 300;
  --jg-perview: 4;
  position: relative;
}

/* breakpoints */

/* 1600이상: 슬라이더 3.5개 */
@media (min-width:1600px){
  .jg-places.jg-places-slider{ --jg-perview:3.5; }
}

/* 1301~1600 */
@media (min-width:1301px) and (max-width:1600px){
  .jg-places{ --jg-gap:10px; --jg-title-size:19px; --jg-addr-size:14px; }
}

/* 1025~1300 */
@media (min-width:1025px) and (max-width:1300px){
  .jg-places{ --jg-gap:10px; --jg-title-size:16px; --jg-addr-size:12px; }
}

/* 881~1024 */
@media (min-width:881px) and (max-width:1024px){
  .jg-places{--jg-gap:10px; --jg-title-size:16px; --jg-addr-size:12px;}
  .jg-places.jg-places-slider{ --jg-perview:3.5; }
}

/* 501~880 */
@media (min-width:501px) and (max-width:880px){
  .jg-places{--jg-gap:10px; --jg-ic-size:12px; --jg-title-size:15px; --jg-addr-size:12px;}
  .jg-places.jg-places-slider{ --jg-perview:3.5; }
}

/* ~500 */
@media (max-width:500px){
  .jg-places{--jg-gap:5px; --jg-ic-size:9px; --jg-title-size:12px; --jg-addr-size:9px;}
  .jg-places.jg-places-slider{ --jg-perview:2.5; }
}


.jg-empty{
  padding:16px;
  border-radius:var(--jg-radius);
  background:rgba(0,0,0,.03);
  color:rgba(0,0,0,.55);
}

.jg-card{
  border-radius:var(--jg-radius);
  background:#fff;
  overflow:hidden;
  height:100%;
  box-shadow:var(--jg-card-shadow);
  filter:none;
}


.jg-card-link{
  display:block;
  color:inherit;
  text-decoration:none;
  height:100%;
}

.jg-card-media{
  /* 카드가 이미 overflow:hidden + radius 처리하므로 중복 라운드 제거(흐릿한 라인 방지) */
  border-radius:0;
  overflow:hidden;
}

.jg-card-img,
.jg-card-img--placeholder{
  width:100%;
  aspect-ratio:3/4;
  display:block;
  /* 요청: 이미지 자체 라운드 20px */
  border-radius:20px;
  object-fit:cover;
  background:rgba(0,0,0,.06);
}

.jg-card-body{
  padding:25px; /* 요청사항: 카드 안 문구 간격 */
}

/* 요청: 그리드형에서는 문구/주소 영역 배경을 #F3F3F3 */
.jg-places-grid .jg-card-body{
  background:#F3F3F3;
}

.jg-card-title-row{
  display:flex;
  align-items:center; /* 제목+화살표 상하 가운데 */
  justify-content:flex-start;
  gap:10px;
  margin-bottom:10px;
}

.jg-card-title{
  font-size:var(--jg-title-size);
  font-weight:var(--jg-title-weight);
  color:var(--jg-title-color);
  line-height:1.25;
  margin:0;
}

.jg-card-title-ic{
  display:flex;              /* 아이콘 baseline 떠보임 방지 */
  align-items:center;
  line-height:0;
  flex:0 0 auto;
  color:rgba(0,0,0,.55);
}
.jg-card-title-ic svg{
  display:block;
  width:var(--jg-ic-size);
  height:var(--jg-ic-size);
}

.jg-card-addr-row{
  display:flex;
  align-items:flex-start;
  gap:8px;
}

.jg-card-addr-ic{
  flex:0 0 auto;
  color:rgba(0,0,0,.55);
  margin-top:1px;
}
.jg-card-addr-ic svg{
  display:block;
  width:var(--jg-ic-size);
  height:var(--jg-ic-size);
}

.jg-card-addr{
  font-size:var(--jg-addr-size);
  font-weight:var(--jg-addr-weight);
  color:rgba(0,0,0,.75);
  line-height:1.4;
}

/* Slider */
.jg-slider-track{
  display:flex;
  gap:var(--jg-gap);
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  /* 카드 그림자 잘림 방지(상/하 여백 확대) */
  padding:16px 12px 24px;
  scrollbar-width:none;
}
.jg-slider-track::-webkit-scrollbar{ display:none; }
.jg-places-slider .jg-card{ scroll-snap-align:start; }

.jg-slider-btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  min-width:40px;
  max-width:40px;
  padding:0;
  line-height:0;
  border-radius:999px !important;
  border:0 !important;
  outline:0 !important;
  /* 네비게이션 화살표(요청): 배경 #fff */
  background:#fff !important;
  box-shadow:none;
  filter: drop-shadow(0 4px 30px rgba(0, 0, 0, 0.10));
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:5;
  /* 네비게이션 화살표(요청): 아이콘 색상 #939393 */
  color:#939393 !important;
  pointer-events:auto;
  -webkit-tap-highlight-color:transparent;
}

.jg-slider-btn:focus,
.jg-slider-btn:focus-visible{
  outline:0 !important;
  box-shadow:none !important;
}

.jg-slider-btn .jg-ic-nav{
  display:block;
  width:18px;
  height:18px;
  background-color:currentColor;
  /* SVG 여백 때문에 아이콘이 한쪽으로 쏠릴 때 보정 */
  transform: translateX(var(--jg-nav-nudge-x, 0px));
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
}
.jg-slider-btn .jg-ic-nav--prev{
  --jg-nav-nudge-x: -4px;
  -webkit-mask-image:url("/wp-content/uploads/2026/01/Keyboard-arrow-right-2.svg");
  mask-image:url("/wp-content/uploads/2026/01/Keyboard-arrow-right-2.svg");
}
.jg-slider-btn .jg-ic-nav--next{
  --jg-nav-nudge-x: -4px;
  -webkit-mask-image:url("/wp-content/uploads/2026/01/Keyboard-arrow-right-3.svg");
  mask-image:url("/wp-content/uploads/2026/01/Keyboard-arrow-right-3.svg");
}

.jg-slider-prev{ left:6px; }
.jg-slider-next{ right:6px; }

.jg-slider-btn:hover,
.jg-slider-btn:active{
  background:#375275 !important;
  color:#fff !important;
}
.jg-slider-btn:active{ transform:translateY(-50%) scale(.98); }

@media (max-width:880px){
  .jg-slider-btn{ width:38px; height:38px; min-width:38px; max-width:38px; }
}

/* Grid */
.jg-places-grid .jg-card{
  /* 요청: 그리드형에서는 카드 그림자 제거 */
  box-shadow:none !important;
  filter:none !important;
}

.jg-places-grid .jg-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:var(--jg-gap);
}

@media (max-width:1300px){ .jg-places-grid .jg-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:1024px){ .jg-places-grid .jg-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:500px) { .jg-places-grid .jg-grid{ grid-template-columns:repeat(1, minmax(0,1fr)); } }

.jg-grid-item.jg-hidden{ display:none; }
.jg-grid-item.jg-filtered-out{ display:none; }

.jg-more-btn{
  margin-top:18px;
  width:100%;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.10);
  background:#fff;
  cursor:pointer;
  font-weight:600;
}
.jg-more-btn:hover{ background:rgba(0,0,0,.03); }

/* Tabs: 문구 기준 너비 + 컨테이너 기준 자동 줄바꿈 */
.jg-places-tabs-wrap{ margin:0 0 16px; }
.jg-places-tabs{
  display:flex;
  flex-wrap:wrap;      /* 자동 줄바꿈 */
  gap:14px;
  list-style:none;
  padding:0;
  margin:0;
  justify-content:flex-start; /* 균등 간격 X */
}
.jg-places-tabs li{ margin:0; padding:0; }

.jg-places-tabs a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;                /* 문구 기준 */
  padding:10px 34px;         /* 좌우 간격 넉넉하게 */
  border-radius:999px;
  border:none;
  background:#fff;
  /* 탭 버튼: 이미지처럼 넓고 부드러운 그림자 */
  box-shadow:0 20px 55px rgba(0,0,0,.12), 0 6px 16px rgba(0,0,0,.06);
  text-decoration:none;
  color:rgba(0,0,0,.80);
  font-weight:600;
  -webkit-tap-highlight-color:transparent;
}
.jg-places-tabs a:active{ transform:none; } /* 클릭할 때 올라가는 느낌 방지 */
/* Tabs breakpoints */
@media (min-width:1301px) and (max-width:1600px){
  .jg-places-tabs{ gap:10px; }
}
@media (min-width:1025px) and (max-width:1300px){
  .jg-places-tabs{ gap:10px; }
}
@media (min-width:881px) and (max-width:1024px){
  .jg-places-tabs{ gap:10px; }
}
@media (max-width:500px){
  .jg-places-tabs{ gap:10px; }
  .jg-places-tabs a{ font-size:13px; }
}

.jg-places-tabs a.is-active{
  background:#375275;
  color:#fff;
  /* 활성 탭도 동일 톤의 그림자 */
  box-shadow:0 22px 60px rgba(0,0,0,.14), 0 6px 18px rgba(0,0,0,.07);
}

/* Slider arrows (standalone shortcode) */
.jg-slider-arrows{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:26px;
}
.jg-slider-arrows .jg-slider-btn{
  position:static;
  top:auto; left:auto; right:auto;
  transform:none;
}

.jg-slider-arrows .jg-slider-btn:active{ transform:scale(.98); }

@media (max-width:880px){
  /* 모바일에서 버튼 크기만 살짝 축소 */
  .jg-slider-btn{ width:38px; height:38px; }
}
/* Navigation select */
.jg-places-nav{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 16px;
}