/* GAON COMMON SITE CSS
   공통 위치: templates_site/assets/gaon-common.css
   이 파일 한 곳만 수정하면 모든 상품 사이트 / generated / Netlify ZIP에 적용됩니다. */

/* 제조사 목록 - PC */
.maker-tab{
  min-height:108px!important;
  grid-template-columns:128px minmax(0,1fr) 22px!important;
  gap:14px!important;
  padding:12px 18px!important;
}
.maker-logo{
  width:122px!important;
  height:76px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-shrink:0!important;
}
.maker-logo img{
  width:114px!important;
  height:68px!important;
  object-fit:contain!important;
  display:block!important;
}
.maker-logo b{font-size:22px!important;font-weight:900!important;}
.maker-tab-name{
  display:block!important;
  font-size:20px!important;
  line-height:1.18!important;
  font-weight:900!important;
  letter-spacing:-.055em!important;
  word-break:keep-all!important;
  overflow-wrap:anywhere!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.maker-tab-count{font-size:15px!important;margin-top:5px!important;line-height:1.1!important;font-weight:800!important;}
.maker-tab-arrow{font-size:22px!important;justify-self:end!important;align-self:center!important;}
.panel-logo{width:122px!important;height:76px!important;display:flex!important;align-items:center!important;justify-content:center!important;}
.panel-logo img{width:114px!important;height:68px!important;object-fit:contain!important;display:block!important;}

/* 팝업에서는 차량 정보만 중앙 정렬, 브랜드 로고는 숨김 */
.selected-card{
  display:block!important;
  grid-template-columns:1fr!important;
  text-align:center!important;
  padding:18px 22px 16px!important;
  background:#fbfcff!important;
}
.selected-logo,#modalLogo{display:none!important;width:0!important;height:0!important;margin:0!important;padding:0!important;}
.selected-title{width:100%!important;text-align:center!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;}
.selected-title strong{width:100%!important;text-align:center!important;margin:0 auto!important;font-size:21px!important;line-height:1.32!important;font-weight:850!important;letter-spacing:-.04em!important;word-break:keep-all!important;overflow-wrap:anywhere!important;}
.selected-title span{width:100%!important;text-align:center!important;margin:6px auto 0!important;font-size:14px!important;line-height:1.35!important;color:#667085!important;font-weight:700!important;}

/* 표/카드 정렬 공통 */
:root{--gaon-list-grid:70px 130px minmax(280px,1fr) 190px minmax(260px,360px) 28px;}
.table-scroll{max-height:calc(100vh - 260px)!important;overflow-y:auto!important;overflow-x:hidden!important;padding:0 20px 18px!important;}
.table-scroll::-webkit-scrollbar{width:10px;}
.table-scroll::-webkit-scrollbar-thumb{background:#c9d2e2;border-radius:999px;}
.table-head,.car-row{grid-template-columns:var(--gaon-list-grid)!important;}
.table-head{position:sticky!important;top:0!important;z-index:50!important;background:#fff!important;box-shadow:0 8px 16px rgba(15,23,42,.06)!important;border-bottom:1px solid #e5e9f0!important;margin:0!important;padding:16px 18px 12px!important;border-radius:0!important;}
.table-head span{padding-left:0!important;text-align:left!important;white-space:nowrap!important;}
.car-list{padding:8px 0 0!important;}
.car-row{display:grid!important;align-items:center!important;gap:0!important;padding:0 18px!important;overflow:hidden!important;}
.car-row .num,.car-row .code,.car-row .car-name,.car-row .year,.car-row .dash-opt,.car-row .chev{min-width:0!important;}
.car-row .code,.car-row .year,.car-row .car-name{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;padding-left:0!important;}
.car-row .dash-opt{display:flex!important;flex-wrap:nowrap!important;gap:6px!important;overflow:hidden!important;padding-left:0!important;}
.car-row .tag{flex:0 0 auto!important;}

/* 제조사 목록 - 모바일 */
@media(max-width:760px){
  .m-maker-btn{
    min-height:108px!important;
    height:auto!important;
    grid-template-columns:128px minmax(0,1fr) 22px!important;
    gap:12px!important;
    padding:12px 16px!important;
    border-radius:18px!important;
  }
  .m-maker-logo{
    width:122px!important;
    height:76px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-shrink:0!important;
  }
  .m-maker-logo img{
    width:114px!important;
    height:68px!important;
    object-fit:contain!important;
    display:block!important;
  }
  .m-maker-name{
    display:block!important;
    font-size:19px!important;
    line-height:1.18!important;
    font-weight:900!important;
    letter-spacing:-.065em!important;
    word-break:keep-all!important;
    overflow-wrap:anywhere!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .m-maker-count{font-size:15px!important;margin-top:5px!important;line-height:1.1!important;font-weight:800!important;}
  .m-arrow{font-size:22px!important;justify-self:end!important;align-self:center!important;}
  .table-scroll{max-height:none!important;overflow:visible!important;padding:0 12px 18px!important;}
  .table-head{display:none!important;}
  .car-row{grid-template-columns:70px 1fr 24px!important;height:auto!important;min-height:78px!important;align-items:flex-start!important;}
  .car-row .car-name,.car-row .year,.m-car-name,.m-car-year{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;display:block!important;-webkit-line-clamp:unset!important;line-clamp:unset!important;max-height:none!important;word-break:keep-all!important;overflow-wrap:anywhere!important;}
  .car-row .code,.m-car-code{white-space:nowrap!important;}
  .car-row .chev{align-self:center!important;}
  .modal{width:min(460px,calc(100vw - 24px))!important;}
  .selected-card{padding:16px 16px 14px!important;text-align:center!important;}
  .selected-title strong{font-size:18px!important;line-height:1.35!important;text-align:center!important;}
  .selected-title span{font-size:13px!important;text-align:center!important;margin-top:5px!important;}
}