/* =========================
   SINJOSNS MODERN UI (PerfectPanel) - FINAL
   - 중복 정리 완료
   - 모바일 탭 스크롤 오류(-webkit-overflow-scrolling) 제거
   ========================= */

/* 기본 */
body{
  background:#f6f7fb;
  font-family: Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  color:#222;
  padding-bottom:84px; /* 하단 고정 메뉴 공간 */
}

a{ text-decoration:none; }
a:hover{ text-decoration:none; }

/* 공통 카드 */
.panel, .well, .card, .table-responsive{
  border-radius:16px !important;
  border:1px solid rgba(0,0,0,.06) !important;
  box-shadow:0 10px 25px rgba(0,0,0,.06);
  background:#fff;
}

/* 버튼 */
.btn{
  border-radius:12px !important;
  font-weight:600;
}

.btn-primary{
  background:#4f46e5 !important;
  border-color:#4f46e5 !important;
}

.btn-primary:hover{
  filter:brightness(.95);
}

/* 입력폼 */
.form-control{
  border-radius:14px !important;
  height:46px;
  border:1px solid rgba(0,0,0,.10);
  box-shadow:none;
  font-size:14px;
}

.form-control:focus{
  border-color:#4f46e5;
  box-shadow:0 0 0 3px rgba(79,70,229,.15);
}

/* =========================
   NAVBAR (상단 여백/높이 줄이기)
   ========================= */
.navbar{
  border-radius:0 !important;
  border:none !important;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
  background:#ffffff !important;
  margin-bottom:6px !important;
}

.navbar-brand{
  font-weight:800;
  padding-top:10px !important;
  padding-bottom:10px !important;
  height:auto !important;
}

.navbar-brand img{
  max-height:26px !important;
  width:auto !important;
}

.navbar-nav > li > a{
  font-weight:600;
}

/* 로그인/회원가입 버튼 느낌 */
.navbar-nav.navbar-right > li > a{
  border-radius:12px;
  padding:10px 14px;
  margin-top:6px;
}

.navbar-nav.navbar-right > li.active > a,
.navbar-nav.navbar-right > li > a:hover{
  background:rgba(79,70,229,.08) !important;
}

/* 모바일에서 navbar padding 줄이기 */
@media (max-width: 991px){
  .navbar .container,
  .navbar .container-fluid{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .navbar-header{
    min-height:52px !important;
  }

  .navbar-toggle{
    margin-top:10px !important;
    margin-bottom:0 !important;
  }

  /* PC용 상단메뉴 숨김 */
  .navbar-left-block{ display:none !important; }
}

/* =========================
   페이지 상단 여백 제거 (공통)
   ========================= */
.page-content,
.wrapper-content,
#content,
.main-content{
  padding-top:0 !important;
  margin-top:0 !important;
}

.container,
.container-fluid{
  padding-top:0 !important;
  margin-top:0 !important;
}

.row{
  margin-top:0 !important;
}

/* well 위쪽 공간 줄이기 */
.well{
  margin-top:0 !important;
  padding-top:14px !important;
}

.panel{
  margin-top:0 !important;
}

/* neworder 폼 상단 여백 */
#order-form{
  margin-top:0 !important;
}

#order-form .form-group:first-child{
  margin-top:0 !important;
}

/* =========================
   테이블
   ========================= */
.table{
  background:#fff;
}

.table > thead > tr > th{
  border-bottom:1px solid rgba(0,0,0,.08);
  font-weight:700;
}

/* 알림 */
#notify-wrapper{
  border-radius:12px;
  box-shadow:0 10px 25px rgba(0,0,0,.08);
}

/* =========================
   AUTH (signin/signup)
   ========================= */
.auth-card{
  background:#fff;
  border-radius:18px;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 18px 45px rgba(0,0,0,.06);
  padding:18px;
  margin-top:18px;
}

.auth-head{ margin-bottom:18px; }

.auth-logo{
  max-height:42px;
  margin-bottom:12px;
}

.auth-title{
  font-size:20px;
  font-weight:900;
  margin:0;
  color:#111;
}

.auth-sub{
  margin-top:6px;
  margin-bottom:0;
  color:#666;
  font-size:13px;
  line-height:1.35;
}

.auth-btn{
  height:48px;
  border-radius:14px !important;
  font-weight:900;
  font-size:14px;
}

.auth-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:10px 0 6px;
}

.auth-check{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:#444;
  margin:0;
}

.forgot-password{
  font-size:13px;
  color:#4f46e5;
  font-weight:600;
}

.auth-link{
  color:#4f46e5;
  font-weight:800;
}

/* =========================
   모바일 하단 고정 메뉴 (bottom-nav)
   ========================= */
.bottom-nav{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:9999;
  background:#fff;
  border-top:1px solid rgba(0,0,0,.08);
  box-shadow:0 -6px 20px rgba(0,0,0,.06);
  display:flex;
  justify-content:space-around;
  align-items:center;
  padding:8px 6px;
  gap:6px;
}

.bottom-nav a{
  flex:1;
  text-align:center;
  text-decoration:none !important;
  color:#222;
  font-size:12px;
  padding:6px 4px;
  border-radius:12px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  transition:all .15s ease;
}

.bottom-nav a:hover{
  background:rgba(0,0,0,.04);
}

.bottom-nav a i{
  font-size:16px;
  line-height:1;
}

.bottom-nav a span{
  display:block;
  line-height:1.1;
  font-weight:700;
}

/* 가운데 잔액 강조 */
.bottom-nav .balance-btn{
  background:#f6f7fb;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 6px 16px rgba(0,0,0,.06);
  padding:8px 6px;
}

.bottom-nav .balance-btn .balance-amount{
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* PC에서는 하단바 숨김 */
@media (min-width: 992px){
  .bottom-nav{ display:none !important; }
}

/* =========================
   SIGNIN EXTRA (Review + FAQ)
   ========================= */
.landing-section{
  border-radius:22px;
  padding:20px;
  margin-top:18px;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 10px 25px rgba(0,0,0,.06);
}

.landing-head{
  margin-bottom:18px;
}

.landing-title{
  font-size:20px;
  font-weight:900;
  margin:0;
  color:#111;
}

.landing-sub{
  margin-top:10px;
  color:#666;
  font-size:13px;
  line-height:1.6;
}

/* Review */
.review-wrap{
  display:flex;
  align-items:center;
  gap:8px;
}

.review-nav{
  width:38px;
  height:38px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.10);
  background:#fff;
  color:#4f46e5;
  box-shadow:0 6px 16px rgba(0,0,0,.06);
}

.review-card{
  flex:1;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:18px;
  padding:14px;
  min-height:120px;
  box-shadow:0 10px 25px rgba(0,0,0,.06);
  transition: opacity .25s ease, transform .25s ease;
}

.review-card.is-fading{
  opacity:0;
  transform:translateY(4px);
}

.review-user{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:10px;
}

.review-avatar{
  width:38px;
  height:38px;
  border-radius:999px;
  background:rgba(79,70,229,.10);
  color:#4f46e5;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  font-size:14px;
}

.review-name{
  font-weight:900;
  font-size:13px;
  color:#111;
}

.review-meta{
  font-size:11px;
  color:#777;
  margin-top:2px;
}

.review-stars{
  margin:2px 0 10px;
  font-size:13px;
  font-weight:800;
  color:#4f46e5;
  letter-spacing:1px;
}

.review-text{
  font-size:12px;
  color:#444;
  line-height:1.6;
}

.review-dots{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:14px;
}

.review-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:rgba(0,0,0,.18);
  cursor:pointer;
}

.review-dot.active{
  background:#4f46e5;
}

/* FAQ */
.faq-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.faq-item{
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 25px rgba(0,0,0,.06);
}

.faq-q{
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:14px 14px;
  background:transparent;
  border:none;
  color:#111;
  font-weight:900;
  font-size:13px;
  text-align:left;
}

.faq-q i{
  color:#4f46e5;
  transition:.2s;
}

.faq-a{
  display:none;
  padding:0 14px 14px 14px;
  color:#555;
  font-size:12px;
  line-height:1.6;
}

.faq-item.open .faq-a{
  display:block;
}

.faq-item.open .faq-q i{
  transform:rotate(45deg);
}

/* =========================
   Responsive Optimization
   ========================= */

/* PC에서 너무 넓게 퍼지는 느낌 방지 */
@media (min-width: 1200px){
  .auth-card{
    max-width:520px;
    margin-left:auto;
    margin-right:auto;
  }

  .landing-section{
    max-width:980px;
    margin-left:auto;
    margin-right:auto;
  }
}

/* 태블릿 이하 최적화 */
@media (max-width: 991px){
  .container{
    width:100% !important;
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .well{
    padding-top:12px !important;
  }
}

/* 네비 메뉴 모바일 터치 편하게 */
@media (max-width: 767px){
  .navbar-nav > li > a{
    padding-top:12px;
    padding-bottom:12px;
  }
}

/* =========================
   ORDERS STATUS TABS (Modern Chip UI)
   ========================= */
.sinjo-orders-tabs.nav-pills{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding:10px 10px;
  margin-bottom:12px;
  background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;
  box-shadow:0 10px 25px rgba(0,0,0,.05);
}

.sinjo-orders-tabs.nav-pills > li{
  float:none !important;
  margin:0 !important;
}

.sinjo-orders-tabs.nav-pills > li > a{
  border-radius:999px !important;
  padding:8px 14px !important;
  font-weight:900;
  font-size:13px;
  color:#333 !important;
  background:#f6f7fb !important;
  border:1px solid rgba(0,0,0,.06) !important;
  transition:all .15s ease;
}

.sinjo-orders-tabs.nav-pills > li > a:hover{
  transform:translateY(-1px);
  background:#fff !important;
  box-shadow:0 8px 20px rgba(0,0,0,.06);
}

.sinjo-orders-tabs.nav-pills > li.active > a,
.sinjo-orders-tabs.nav-pills > li.active > a:hover,
.sinjo-orders-tabs.nav-pills > li.active > a:focus{
  background:rgba(79,70,229,.10) !important;
  border-color:rgba(79,70,229,.35) !important;
  color:#4f46e5 !important;
}

/* 검색칸 */
.sinjo-orders-tabs.nav-pills > li.search{
  margin-left:auto !important;
}

.sinjo-orders-tabs.nav-pills > li.search .input-group{
  width:280px;
  max-width:100%;
}

.sinjo-orders-tabs.nav-pills > li.search input.form-control{
  height:40px !important;
  border-radius:12px 0 0 12px !important;
  border:1px solid rgba(0,0,0,.10) !important;
}

.sinjo-orders-tabs.nav-pills > li.search .btn{
  height:40px !important;
  border-radius:0 12px 12px 0 !important;
  border:1px solid rgba(0,0,0,.10) !important;
}

/* =========================
   Mobile: 탭 가로 스크롤 (짤림 방지)
   -webkit-overflow-scrolling 제거(에러 방지)
   ========================= */
@media (max-width: 991px){
  .sinjo-orders-tabs.nav-pills{
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    padding:10px;
    gap:8px;
  }

  .sinjo-orders-tabs.nav-pills > li.search{
    display:block;
    width:100%;
    margin-left:0 !important;
    margin-top:10px !important;
  }

  .sinjo-orders-tabs.nav-pills > li.search .input-group{
    width:100% !important;
  }

  .sinjo-orders-tabs.nav-pills > li > a{
    padding:10px 14px !important;
    font-size:13px;
    white-space:nowrap;
  }
}
/* neworder 약관동의 강제 표시 */
#order-form .terms{
  display:flex !important;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  font-size:13px;
  color:#333;
  font-weight:700;
}

#order-form .terms input[type="checkbox"]{
  width:18px;
  height:18px;
  margin:0;
}

#order-form .terms a{
  color:#4f46e5;
  font-weight:900;
}
/* 모바일에서도 우측 프로필 아이콘은 항상 보이게 */
@media (max-width: 991px){
  .navbar-right-block{
    display:block !important;
    float:right !important;
  }

  .sinjo-account-dropdown{
    display:block !important;
  }
}
@media (max-width: 991px){
  .navbar-toggle{
    display:none !important;
  }
}