/* /assets/css/common.css - TIRETOP (전문 타이어 쇼핑몰 디자인) */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:15px}
body{
  font-family:'Pretendard','Noto Sans KR','Apple SD Gothic Neo',-apple-system,BlinkMacSystemFont,sans-serif;
  color:#1e293b;background:#f1f5f9;line-height:1.6;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  letter-spacing:-0.01em;
}
a{text-decoration:none;color:inherit}
ul{list-style:none}
img{max-width:100%;display:block}
button{cursor:pointer;font-family:inherit;border:none;background:none}
input,select,textarea{font-family:inherit;font-size:inherit}

:root{
  --primary:#0f172a;
  --primary-dark:#020617;
  --accent:#2563eb;
  --accent-dark:#1d4ed8;
  --accent-light:#dbeafe;
  --navy:#0f172a;
  --navy-light:#1e293b;
  --amber:#f59e0b;
  --amber-light:#fef3c7;
  --green:#16a34a;
  --red:#dc2626;
  --gray1:#0f172a;
  --gray2:#334155;
  --gray3:#64748b;
  --gray4:#94a3b8;
  --gray5:#cbd5e1;
  --gray6:#e2e8f0;
  --gray7:#f1f5f9;
  --gray8:#f8fafc;
  --white:#fff;
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:16px;
  --shadow-xs:0 1px 2px rgba(0,0,0,.04);
  --shadow-sm:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);
  --shadow-md:0 4px 6px -1px rgba(0,0,0,.08),0 2px 4px -2px rgba(0,0,0,.04);
  --shadow-lg:0 10px 15px -3px rgba(0,0,0,.08),0 4px 6px -4px rgba(0,0,0,.04);
  --shadow-xl:0 20px 25px -5px rgba(0,0,0,.10),0 8px 10px -6px rgba(0,0,0,.04);
  --max-w:1200px;
}

/* ===== 상단 유틸바 ===== */
.tt-utilbar{background:#0f172a;color:#64748b;font-size:12px;font-weight:500}
.tt-utilbar-inner{max-width:var(--max-w);margin:0 auto;padding:0 20px;
  height:36px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.tt-utilbar-left{display:flex;align-items:center;gap:6px;font-size:12px;color:#94a3b8;font-weight:600}
.tt-utilbar-right{display:flex;align-items:center;gap:12px}
.tt-utilbar a{color:#94a3b8;transition:color .12s;font-weight:500}
.tt-utilbar a:hover{color:#fff}
.tt-utilbar-sep{color:#334155}

/* ===== 헤더 ===== */
.tt-header{position:sticky;top:0;z-index:9000;background:rgba(255,255,255,.96);
  backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid #e2e8f0;transition:box-shadow .2s,border-color .2s}
.tt-header.scrolled{box-shadow:0 1px 8px rgba(0,0,0,.06);border-color:#e2e8f0}
.tt-header-inner{max-width:var(--max-w);margin:0 auto;padding:0 20px;
  height:68px;display:flex;align-items:center;gap:16px}
.tt-logo{flex-shrink:0;display:flex;align-items:center;height:100%;min-width:0}
.tt-logo-img{height:48px;width:auto;max-height:52px;object-fit:contain}
.tt-nav{display:flex;gap:2px;align-items:center;flex-shrink:0}
.tt-nav a{font-size:15px;font-weight:700;color:#1e293b;padding:8px 12px;position:relative;
  border-radius:8px;transition:color .12s,background .12s;white-space:nowrap}
.tt-nav a:hover{color:#2563eb;background:#f1f5f9}
.tt-nav a.active{color:#2563eb}
.tt-header-search{
  display:flex;align-items:center;gap:4px;
  background:#f1f5f9;border:1px solid #e2e8f0;border-radius:10px;
  padding:4px 4px 4px 12px;flex:1 1 auto;min-width:0;max-width:320px;margin:0 4px;
  transition:border-color .15s,background .15s,box-shadow .15s;
}
.tt-header-search:focus-within{
  border-color:#2563eb;background:#fff;box-shadow:0 0 0 3px rgba(37,99,235,.1);
}
.tt-search-type{
  border:none;background:transparent;font-size:13px;color:#334155;
  padding-right:8px;border-right:1px solid #e2e8f0;cursor:pointer;outline:none;font-weight:600;
}
.tt-search-input{
  flex:1;min-width:0;border:none;background:transparent;
  font-size:14px;color:#0f172a;outline:none;padding:0 4px;
}
.tt-search-input::placeholder{ color:#94a3b8; }
.tt-search-btn{
  flex:0 0 auto;width:32px;height:32px;border-radius:8px;border:none;
  background:#0f172a;color:#fff;display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:background .15s;
}
.tt-search-btn:hover{ background:#1e293b; }
.tt-header-actions{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;flex-shrink:0}
.tt-header-actions a{padding:6px 10px;border-radius:8px;transition:background .12s;color:#1e293b}
.tt-header-actions a:hover{background:#f1f5f9}
.tt-cart-link{position:relative;color:#1e293b;padding:6px 10px;border-radius:8px;transition:background .12s}
.tt-cart-link:hover{background:#f1f5f9}
.tt-cart-badge{position:absolute;top:0;right:2px;background:#2563eb;color:#fff;
  font-size:11px;font-weight:800;border-radius:999px;min-width:18px;height:18px;
  display:flex;align-items:center;justify-content:center;padding:0 4px}
.tt-user-type-badge{
  font-size:11px;font-weight:800;padding:3px 10px;border-radius:6px;
  background:#dbeafe;color:#1d4ed8;white-space:nowrap;
}
.tt-user-type-badge.biz{background:#fef3c7;color:#92400e;}
.tt-signup-link{font-weight:800;color:#2563eb!important;}

/* ===== 히어로 (내 차로 타이어 찾기) ===== */
.hero{background:linear-gradient(135deg,#0f172a 0%,#1e293b 50%,#0f172a 100%);padding:48px 20px;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:0;left:50%;width:600px;height:600px;
  background:radial-gradient(circle,rgba(37,99,235,.08) 0%,transparent 70%);
  transform:translateX(-50%);pointer-events:none}
.hero-inner{max-width:var(--max-w);margin:0 auto;text-align:center;color:#fff;position:relative;z-index:1}
.hero-title{font-size:30px;font-weight:900;margin-bottom:10px;letter-spacing:-.03em}
.hero-desc{font-size:15px;color:#94a3b8;margin-bottom:28px;font-weight:500}
.hero-search-box{background:#fff;border-radius:16px;max-width:640px;margin:0 auto;
  padding:24px;box-shadow:0 20px 40px rgba(0,0,0,.15)}
.btn-hero-primary{display:inline-block;margin-top:20px;background:#2563eb;color:#fff;
  font-weight:800;padding:14px 32px;border-radius:10px;font-size:15px;transition:background .15s}
.btn-hero-primary:hover{background:#1d4ed8}

/* ===== 섹션 공통 ===== */
.rec-sec{padding:48px 20px}
.sec-inner{max-width:var(--max-w);margin:0 auto}
.sec-title{font-size:24px;font-weight:800;color:#0f172a;margin-bottom:20px;
  display:flex;align-items:center;gap:8px;letter-spacing:-.03em}
.sec-title .sec-sub{font-size:13px;font-weight:500;color:#94a3b8}
.sec-title-more{margin-left:auto;font-size:13px;font-weight:600;color:#64748b;transition:color .12s}
.sec-title-more:hover{color:#2563eb}
.empty-msg{padding:60px 0;text-align:center;color:#94a3b8;font-size:14px}

/* ================================================
   상품 그리드 & 카드 (전문 타이어 쇼핑몰 스타일)
   ================================================ */
.prod-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.prod-grid .prod-card{background:#fff;border-radius:12px;overflow:hidden;
  border:1px solid #e2e8f0;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s;display:block;
  text-decoration:none;color:inherit}
.prod-grid .prod-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.06);border-color:#cbd5e1}
.prod-grid .prod-img-wrap{position:relative;width:100%;aspect-ratio:1/1;background:#f8fafc;overflow:hidden}
.prod-grid .prod-img-wrap img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .3s ease}
.prod-grid .prod-card:hover .prod-img-wrap img{transform:scale(1.04)}
.prod-grid .prod-img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  font-size:42px;color:#cbd5e1}

.prod-grid .prod-badge-wrap{position:absolute;top:8px;left:8px;display:flex;flex-direction:column;gap:4px;z-index:3}
.prod-grid .prod-badge{
  position:absolute;top:8px;left:8px;z-index:3;
  font-size:11px;font-weight:800;color:#fff;padding:3px 8px;border-radius:6px;
  letter-spacing:-.01em;
}
.prod-grid .badge-best{background:#f97316;top:8px;left:8px}
.prod-grid .badge-hot{background:#f59e0b;top:8px;left:8px}
.prod-grid .badge-new{background:#22c55e;top:8px;left:8px}
.prod-grid .badge-sale{background:#2563eb;top:8px;left:8px}
.prod-grid .badge-biz{background:#f59e0b;top:36px;left:8px}

.prod-grid .prod-brand-logo-bar{
  position:absolute;top:0;left:0;right:0;
  display:flex;align-items:center;justify-content:center;
  padding:5px 10px;
  background:rgba(255,255,255,.95);
  border-bottom:1px solid #e5e7eb;
  z-index:2;
  min-height:36px;
}
.prod-grid .prod-brand-logo-bar img{
  max-height:26px;max-width:120px;object-fit:contain;
}
.prod-grid .prod-brand-logo-text{
  font-size:12px;font-weight:800;color:var(--gray1);letter-spacing:.2px;
}

.prod-grid .prod-body{padding:12px 14px 14px}
.prod-grid .prod-brand-rating-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.prod-grid .prod-brand-name{font-size:11px;color:#94a3b8;font-weight:700;letter-spacing:.02em}
.prod-grid .prod-title{font-size:14px;font-weight:700;color:#1e293b;margin-bottom:4px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:38px;line-height:1.4}
.prod-grid .prod-model{font-size:12px;color:#94a3b8;margin-bottom:8px}
.prod-grid .prod-rating{font-size:12px;color:#64748b;display:flex;align-items:center;gap:3px}
.prod-grid .prod-rating .star{color:#fbbf24;font-size:13px}
.prod-grid .prod-price-area{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;margin-top:6px}
.prod-grid .prod-discount-pct{color:#2563eb;font-weight:900;font-size:16px}
.prod-grid .prod-price-now{font-size:18px;font-weight:900;color:#0f172a;letter-spacing:-.02em}
.prod-grid .prod-price-orig{font-size:12px;color:#94a3b8;text-decoration:line-through}

.prod-tag-row{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.prod-tag{
  font-size:10px;font-weight:600;
  color:#6b7280;background:#f3f4f6;
  border-radius:999px;padding:3px 8px;
  border:1px solid #e5e7eb;
}
.prod-tag:first-child{background:#ede9fe;color:#7c3aed;border-color:#ddd6fe}

/* ===== 혜택 섹션 ===== */
.benefit-sec{background:#fff;padding:56px 24px;border-top:1px solid #e2e8f0}
.benefit-grid{max-width:var(--max-w);margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.benefit-card{text-align:center;transition:transform .15s}
.benefit-card:hover{transform:translateY(-4px)}
.benefit-icon{width:56px;height:56px;margin:0 auto 14px;border-radius:50%;background:#f1f5f9;
  display:flex;align-items:center;justify-content:center;font-size:26px}
.benefit-title{font-size:15px;font-weight:800;color:#0f172a;margin-bottom:6px}
.benefit-desc{font-size:13px;color:#64748b;line-height:1.5}

/* ===== 필터바 ===== */
.filter-bar{display:flex;gap:10px;margin-bottom:16px}
.filter-bar input[type=text]{flex:1;border:1px solid #e2e8f0;border-radius:10px;
  padding:10px 14px;font-size:14px;transition:border-color .15s}
.filter-bar input[type=text]:focus{outline:none;border-color:#2563eb}
.filter-bar select{border:1px solid #e2e8f0;border-radius:10px;padding:10px 14px;font-size:14px}
.filter-bar button{padding:10px 22px;border:none;border-radius:10px;
  background:#0f172a;color:#fff;font-weight:700;cursor:pointer;transition:background .15s}
.filter-bar button:hover{background:#1e293b}
.filter-count{margin-bottom:16px;font-size:13px;color:#64748b}

/* ===== 페이지네이션 ===== */
.pagination{display:flex;justify-content:center;gap:6px;margin-top:32px}
.pagination a,.pagination span{width:36px;height:36px;display:flex;align-items:center;justify-content:center;
  border-radius:8px;font-size:13px;color:#64748b;font-weight:700;transition:background .12s}
.pagination a:hover{background:#f1f5f9}
.pagination .active{background:#2563eb;color:#fff}
.pagination .pg-arrow{font-size:18px;font-weight:900;color:#334155}
.pagination .pg-arrow.pg-disabled{color:#cbd5e1;cursor:default}

/* ===== 버튼 공통 ===== */
.btn-primary{background:#2563eb;color:#fff;border:none;border-radius:10px;
  padding:12px 20px;font-weight:800;font-size:14px;cursor:pointer;transition:background .15s}
.btn-primary:hover{background:#1d4ed8}
.btn-cart-lg{background:#0f172a;color:#fff;border:none;border-radius:10px;
  padding:14px 0;flex:1;font-weight:800;font-size:15px;cursor:pointer;transition:background .15s}
.btn-cart-lg:hover{background:#1e293b}
.btn-primary-lg{background:#2563eb;color:#fff;border:none;border-radius:10px;
  padding:14px 0;flex:1;font-weight:800;font-size:15px;cursor:pointer;transition:background .15s}
.btn-primary-lg:hover{background:#1d4ed8}

/* ===== 인증 카드 ===== */
.auth-wrap{max-width:420px;margin:60px auto;padding:36px;background:#fff;
  border-radius:16px;border:1px solid #e2e8f0;box-shadow:0 4px 12px rgba(0,0,0,.04)}
.auth-wrap h1{font-size:22px;font-weight:900;margin-bottom:24px;text-align:center;color:#0f172a}
.auth-wrap label{display:block;font-size:13px;font-weight:700;color:#334155;margin-bottom:6px}
.auth-wrap input{width:100%;border:1.5px solid #e2e8f0;border-radius:10px;
  padding:11px 14px;font-size:14px;margin-bottom:16px;transition:border-color .15s,box-shadow .15s}
.auth-wrap input:focus{outline:none;border-color:#0f172a;box-shadow:0 0 0 3px rgba(15,23,42,.08)}
.auth-wrap .btn-primary{width:100%;padding:14px 0;font-size:15px}
.error-msg{background:#fef2f2;color:#b91c1c;font-size:13px;padding:10px 14px;
  border-radius:10px;margin-bottom:16px}

/* ===== 푸터 ===== */
.tt-footer{background:#0f172a;color:#64748b;padding:48px 20px 32px;margin-top:0;font-size:12px;border-top:3px solid #2563eb}
.tt-footer-inner{max-width:var(--max-w);margin:0 auto;line-height:1.8}
.tt-footer-links{display:flex;justify-content:center;gap:20px;margin-bottom:20px;flex-wrap:wrap}
.tt-footer-links a{font-size:13px;color:#94a3b8;transition:color .12s}
.tt-footer-links a:hover{color:#fff}
.tt-footer-privacy{font-weight:700;color:#cbd5e1}
.tt-footer-divider{color:#334155}
.tt-footer p{text-align:center;font-size:12px;line-height:1.8;margin:4px 0;color:#64748b}

/* ===== 반응형 ===== */
@media (max-width:1024px){
  .prod-grid{grid-template-columns:repeat(3,1fr)}
  .benefit-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .prod-grid{grid-template-columns:repeat(2,1fr)}
  .tt-nav{display:none}
  .hero-title{font-size:24px}
}

/* ===== 마이페이지 ===== */
.mypage-wrap{max-width:var(--max-w);margin:0 auto;padding:40px 24px;display:flex;gap:32px}
.mypage-side{width:220px;flex-shrink:0}
.mypage-profile-card{background:#fff;border-radius:var(--radius-md);padding:24px;
  box-shadow:var(--shadow-sm);text-align:center;margin-bottom:16px}
.mypage-profile-card .mp-name{font-size:16px;font-weight:800;color:var(--gray1);margin-bottom:4px}
.mypage-profile-card .mp-email{font-size:12px;color:var(--gray4)}

.mypage-tabs{background:#fff;border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-sm)}
.mypage-tabs a{display:block;padding:14px 18px;font-size:14px;font-weight:700;
  color:var(--gray3);border-bottom:1px solid var(--gray6)}
.mypage-tabs a:last-child{border-bottom:none}
.mypage-tabs a:hover,.mypage-tabs a.active{background:var(--gray6);color:var(--primary)}

.mypage-main{flex:1;min-width:0}
.mypage-section{background:#fff;border-radius:var(--radius-md);padding:28px;
  box-shadow:var(--shadow-sm);margin-bottom:24px}
.mypage-section h2{font-size:18px;font-weight:900;color:var(--gray1);margin-bottom:20px;
  padding-bottom:14px;border-bottom:2px solid var(--gray1)}

.order-table{width:100%;border-collapse:collapse;font-size:13px}
.order-table th{text-align:left;color:var(--gray4);font-weight:700;padding:10px 8px;
  border-bottom:1px solid var(--gray5)}
.order-table td{padding:12px 8px;border-bottom:1px solid var(--gray6);color:var(--gray1)}
.order-status{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:800}
.status-pending{background:#fef3c7;color:#b45309}
.status-paid{background:#dbeafe;color:#1d4ed8}
.status-shipped{background:#e0e7ff;color:#4338ca}
.status-delivered{background:#dcfce7;color:#15803d}
.status-cancelled{background:#fee2e2;color:#b91c1c}

.wish-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.wish-card{position:relative}
.wish-remove-form{position:absolute;top:8px;right:8px;z-index:3}
.wish-remove-btn{width:26px;height:26px;border-radius:50%;background:rgba(0,0,0,.55);
  color:#fff;border:none;font-size:13px;line-height:1}
.wish-remove-btn:hover{background:var(--primary)}

.mp-form-row{margin-bottom:18px}
.mp-form-row label{display:block;font-size:13px;font-weight:700;color:var(--gray3);margin-bottom:6px}
.mp-form-row input{width:100%;max-width:420px;border:1px solid var(--gray5);
  border-radius:var(--radius-sm);padding:11px 14px;font-size:14px}
.mp-form-row input[readonly]{background:var(--gray6);color:var(--gray4)}

@media (max-width:768px){
  .mypage-wrap{flex-direction:column}
  .mypage-side{width:100%}
  .wish-grid{grid-template-columns:repeat(2,1fr)}
}

/* ===== 상품 상세페이지 ===== */
.pd-wrap{max-width:var(--max-w);margin:0 auto;padding:32px 24px 60px}
.pd-breadcrumb{font-size:13px;color:var(--gray4);margin-bottom:20px}
.pd-breadcrumb a{color:var(--gray4)}
.pd-breadcrumb a:hover{color:var(--primary)}

.pd-top{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-bottom:56px}

.pd-gallery{position:sticky;top:96px;align-self:start}
.pd-main-img{width:100%;aspect-ratio:1/1;border-radius:var(--radius-lg);overflow:hidden;
  background:var(--gray6);box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center}
.pd-main-img img{width:100%;height:100%;object-fit:cover}
.pd-main-img .ph{font-size:72px;color:var(--gray5)}

.pd-info{padding-top:4px}
.pd-brand{font-size:13px;font-weight:800;color:var(--gray3);margin-bottom:8px;letter-spacing:.3px}
.pd-title{font-size:26px;font-weight:900;color:var(--gray1);line-height:1.35;margin-bottom:10px}
.pd-model{font-size:13px;color:var(--gray4);margin-bottom:14px}

.pd-rating-line{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--gray3);
  padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--gray5)}
.pd-rating-line .star{color:#fbbf24;font-size:15px}
.pd-rating-line strong{color:var(--gray1);font-weight:800}

.pd-price-box{margin-bottom:24px}
.pd-price-top{display:flex;align-items:baseline;gap:8px;margin-bottom:4px}
.pd-discount-pct{font-size:24px;font-weight:900;color:var(--primary)}
.pd-price-now{font-size:28px;font-weight:900;color:var(--gray1)}
.pd-price-orig{font-size:14px;color:var(--gray4);text-decoration:line-through}
.pd-badge-row{display:flex;gap:6px;margin-bottom:16px}

.pd-option-group{margin-bottom:20px}
.pd-option-group label{display:block;font-size:13px;font-weight:700;color:var(--gray3);margin-bottom:8px}
.pd-option-group select{width:100%;border:1px solid var(--gray5);border-radius:var(--radius-sm);
  padding:13px 14px;font-size:14px;background:#fff;appearance:none}
.pd-option-group select:disabled{background:var(--gray6);color:var(--gray4)}
.pd-stock-warn{font-size:12px;color:var(--primary);margin-top:6px}
.pd-dot-info{font-size:14px;color:#374151;margin-bottom:6px}
.pd-dot-info strong{color:#111827}
.pd-stock-ok{font-size:14px;color:#22c55e;font-weight:600}
.pd-restock-row{display:flex;align-items:center;gap:8px;margin-top:10px}
.pd-restock-row input{padding:8px 10px;border:1px solid #ddd;border-radius:8px;font-size:14px;text-align:center}
.btn-restock{padding:10px 18px;background:#f59e0b;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;transition:background .2s}
.btn-restock:hover{background:#d97706}
.btn-restock:disabled{opacity:.6;cursor:not-allowed}

.tp-dot-nostock{padding:8px 0}
.tp-dot-nostock p{font-size:12px;color:#9ca3af;margin-bottom:6px}
.tp-restock-row{display:flex;align-items:center;gap:6px}
.tp-restock-row input{padding:6px 8px;border:1px solid #ddd;border-radius:6px;font-size:12px;text-align:center}
.btn-restock-request{padding:8px 12px;background:#f59e0b;color:#fff;border:none;border-radius:6px;font-size:12px;font-weight:700;cursor:pointer;transition:background .2s;white-space:nowrap}
.btn-restock-request:hover{background:#d97706}
.btn-restock-request:disabled{opacity:.6;cursor:not-allowed}

.pd-qty-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.pd-qty-row label{font-size:13px;font-weight:700;color:var(--gray3)}
.pd-qty-stepper{display:flex;align-items:center;border:1px solid var(--gray5);border-radius:var(--radius-sm);overflow:hidden}
.pd-qty-stepper button{width:38px;height:38px;background:var(--gray6);border:none;font-size:16px;font-weight:700;color:var(--gray1)}
.pd-qty-stepper button:hover{background:var(--gray5)}
.pd-qty-stepper input{width:50px;height:38px;text-align:center;border:none;border-left:1px solid var(--gray5);
  border-right:1px solid var(--gray5);font-size:14px;font-weight:700}

.pd-total-line{display:flex;justify-content:space-between;align-items:center;
  padding:16px 0;border-top:1px solid var(--gray5);margin-bottom:20px;font-size:14px;color:var(--gray3)}
.pd-total-line strong{font-size:20px;color:var(--primary);font-weight:900}

.pd-btn-row{display:flex;gap:10px}
.pd-btn-wish{width:52px;height:52px;flex-shrink:0;border:1px solid var(--gray5);border-radius:var(--radius-sm);
  background:#fff;font-size:20px;color:var(--gray4);display:flex;align-items:center;justify-content:center}
.pd-btn-wish.active{color:var(--primary);border-color:var(--primary)}
.pd-btn-wish, .btn-cart-lg, .btn-primary-lg{height:52px}

.pd-benefit-box{margin-top:24px;background:var(--gray6);border-radius:var(--radius-md);padding:16px 18px;font-size:12.5px;color:var(--gray3);line-height:1.7}
.pd-benefit-box b{color:var(--gray1)}

.pd-tabs{display:flex;border-bottom:2px solid var(--gray5);margin-bottom:32px}
.pd-tab-btn{padding:16px 28px;font-size:15px;font-weight:800;color:var(--gray4);
  border-bottom:2px solid transparent;margin-bottom:-2px;background:none;border-top:none;border-left:none;border-right:none}
.pd-tab-btn.active{color:var(--gray1);border-bottom-color:var(--primary)}
.pd-tab-panel{display:none}
.pd-tab-panel.active{display:block}

.pd-review-summary{display:flex;align-items:center;gap:24px;background:var(--gray6);
  border-radius:var(--radius-md);padding:24px;margin-bottom:24px}
.pd-review-score{font-size:36px;font-weight:900;color:var(--gray1)}
.pd-review-score-sub{font-size:12px;color:var(--gray4)}
.pd-review-card{padding:20px 0;border-bottom:1px solid var(--gray6)}
.pd-review-card:last-child{border-bottom:none}
.pd-review-head{display:flex;justify-content:space-between;font-size:13px;margin-bottom:8px}
.pd-review-head .name{font-weight:700;color:var(--gray1)}
.pd-review-head .date{color:var(--gray4)}
.pd-review-stars{color:#fbbf24;font-size:13px;margin-bottom:6px}
.pd-review-body{font-size:14px;color:var(--gray1);line-height:1.6}

@media (max-width:900px){
  .pd-top{grid-template-columns:1fr;gap:24px}
  .pd-gallery{position:static}
}

/* ===== 결제 페이지 ===== */
.checkout-wrap{max-width:720px;margin:0 auto;padding:40px 24px 80px}
.checkout-title{font-size:24px;font-weight:900;margin-bottom:24px}
.checkout-section{background:#fff;border-radius:var(--radius-md);padding:24px;
  box-shadow:var(--shadow-sm);margin-bottom:20px}
.checkout-section h2{font-size:16px;font-weight:800;margin-bottom:16px;
  padding-bottom:12px;border-bottom:1px solid var(--gray5)}
.checkout-total-row{display:flex;justify-content:space-between;font-size:14px;
  color:var(--gray3);padding:8px 0}
.checkout-total-row strong{color:var(--gray1);font-weight:800}
.payment-notice{background:var(--gray6);font-size:13px;color:var(--gray3);line-height:1.7}
.pay-account{font-weight:800;color:var(--gray1);margin-top:6px}
.checkout-submit{width:100%;font-size:16px;margin-top:8px}

/* ===== 주소 검색 버튼 ===== */
.addr-search-row{display:flex;gap:8px}
.addr-search-row input{flex:1}
.btn-addr-search{flex-shrink:0;padding:0 16px;height:44px;border:1px solid var(--gray1);
  border-radius:var(--radius-sm);background:#fff;color:var(--gray1);font-weight:700;font-size:13px;white-space:nowrap}
.btn-addr-search:hover{background:var(--gray1);color:#fff}
#zipcode, #address1{background:var(--gray6);color:var(--gray1);cursor:default}

/* ===== 장바구니 페이지 ===== */
.cart-wrap{max-width:960px;margin:0 auto;padding:40px 24px 80px}
.cart-title{font-size:24px;font-weight:900;margin-bottom:24px}

.cart-select-bar{display:flex;justify-content:space-between;align-items:center;
  background:#fff;border-radius:var(--radius-md);padding:16px 20px;margin-bottom:12px;
  box-shadow:var(--shadow-sm);font-size:13px;color:var(--gray3)}
.cart-select-bar label{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--gray1)}
.cart-select-bar input[type=checkbox]{width:18px;height:18px}
.cart-remove-selected{background:none;border:none;color:var(--gray4);font-size:13px;text-decoration:underline}
.cart-remove-selected:hover{color:var(--primary)}

.cart-list{background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden;margin-bottom:24px}
.cart-item{display:flex;align-items:center;gap:16px;padding:20px;border-bottom:1px solid var(--gray6)}
.cart-item:last-child{border-bottom:none}
.cart-item.stock-warn{background:#fef2f2}

.cart-item-check{width:18px;height:18px;flex-shrink:0}

.cart-item-img{width:90px;height:90px;border-radius:var(--radius-sm);overflow:hidden;
  background:var(--gray6);flex-shrink:0;display:flex;align-items:center;justify-content:center}
.cart-item-img img{width:100%;height:100%;object-fit:cover}
.cart-item-img .ph{font-size:32px;color:var(--gray5)}

.cart-item-info{flex:1;min-width:0}
.cart-item-brand{font-size:11px;color:var(--gray3);font-weight:800;margin-bottom:3px}
.cart-item-name{font-size:14px;font-weight:700;color:var(--gray1);margin-bottom:3px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cart-item-option{font-size:12px;color:var(--gray4)}
.cart-item-stockwarn{font-size:12px;color:var(--primary);font-weight:700;margin-top:4px}

.cart-item-qty{display:flex;align-items:center;border:1px solid var(--gray5);border-radius:var(--radius-sm);
  overflow:hidden;flex-shrink:0}
.cart-item-qty button{width:32px;height:32px;background:var(--gray6);border:none;font-size:14px;font-weight:700}
.cart-item-qty button:hover{background:var(--gray5)}
.cart-item-qty input{width:44px;height:32px;text-align:center;border:none;
  border-left:1px solid var(--gray5);border-right:1px solid var(--gray5);font-size:13px;font-weight:700}

.cart-item-price{width:110px;text-align:right;flex-shrink:0}
.cart-item-price .now{font-size:15px;font-weight:900;color:var(--gray1)}
.cart-item-price .orig{font-size:11px;color:var(--gray4);text-decoration:line-through;display:block}

.cart-item-remove{width:28px;height:28px;flex-shrink:0;border:none;background:none;
  color:var(--gray4);font-size:16px}
.cart-item-remove:hover{color:var(--primary)}

.cart-summary{background:#fff;border-radius:var(--radius-md);padding:24px;box-shadow:var(--shadow-sm)}
.cart-summary-row{display:flex;justify-content:space-between;font-size:14px;color:var(--gray3);padding:6px 0}
.cart-summary-row.total{border-top:1px solid var(--gray5);margin-top:10px;padding-top:14px;
  font-size:16px;color:var(--gray1);font-weight:900}
.cart-summary-row.total strong{color:var(--primary);font-size:20px}
.cart-checkout-btn{display:block;width:100%;text-align:center;margin-top:18px;padding:16px 0;
  background:var(--primary);color:#fff;border-radius:var(--radius-sm);font-weight:800;font-size:15px}
.cart-checkout-btn:hover{background:var(--primary-dark)}
.cart-checkout-btn.disabled{background:var(--gray5);color:var(--gray4);pointer-events:none}

.cart-empty{text-align:center;padding:100px 0}
.cart-empty .icon{font-size:56px;margin-bottom:16px;color:var(--gray5)}
.cart-empty p{color:var(--gray4);font-size:14px;margin-bottom:20px}

@media (max-width:640px){
  .cart-item{flex-wrap:wrap}
  .cart-item-price{width:auto;margin-left:auto}
}

/* ===== 폼 인라인 에러 표시 ===== */
.mp-form-row.has-error input{border-color:var(--primary);background:#fef2f2}
.mp-form-row .field-error{display:none;color:var(--primary);font-size:12px;font-weight:700;margin-top:5px}
.mp-form-row.has-error .field-error{display:block}

/* ===== 주문완료 페이지 ===== */
.order-complete-wrap{max-width:640px;margin:0 auto;padding:60px 24px 80px;text-align:center}
.complete-icon{font-size:56px;margin-bottom:16px}
.order-complete-wrap h1{font-size:22px;font-weight:900;margin-bottom:10px}
.order-no{font-size:14px;color:var(--gray3);margin-bottom:32px}
.order-no strong{color:var(--gray1)}

.order-item-table{width:100%;border-collapse:collapse;margin-bottom:20px;text-align:left}
.order-item-table th{font-size:12px;color:var(--gray4);padding:10px 8px;border-bottom:1px solid var(--gray5)}
.order-item-table td{font-size:13px;padding:12px 8px;border-bottom:1px solid var(--gray6);color:var(--gray1)}

.order-total{text-align:right;font-size:15px;color:var(--gray3);margin-bottom:24px}
.order-total strong{color:var(--primary);font-size:19px;font-weight:900}

.order-recipient-info{background:var(--gray6);border-radius:var(--radius-md);padding:18px;
  text-align:left;font-size:13px;color:var(--gray3);line-height:1.8;margin-bottom:20px}
.order-recipient-info strong{color:var(--gray1);margin-right:6px}

.payment-notice{text-align:left;margin-bottom:32px}

.complete-actions{display:flex;gap:10px}
.complete-actions a{flex:1;padding:14px 0;border-radius:var(--radius-sm);font-weight:800;font-size:14px}
.btn-outline{border:1px solid var(--gray5);color:var(--gray1);background:#fff}
.btn-outline:hover{background:var(--gray6)}

/* ===== product-list.php 개별 카드 스타일 (별도 페이지용 — 홈 화면 .prod-grid 와 무관) ===== */
.prod-card{background:#fff;border:1px solid var(--gray6);border-radius:12px;overflow:hidden;}
.prod-card-link{display:block;text-decoration:none;color:inherit;}
.prod-thumb{width:100%;height:180px;object-fit:cover;}
.prod-thumb-placeholder{width:100%;height:180px;display:flex;align-items:center;justify-content:center;background:#f2f3f5;color:#aaa;}
.prod-brand-badge{display:inline-block;margin:8px 14px 0;font-size:12px;color:#888;}
.prod-title{margin:4px 14px 0;font-size:15px;font-weight:700;}
.prod-model{margin:2px 14px 8px;font-size:12px;color:#999;}
.prod-price-single{padding:0 14px 14px;}
.prod-discount{color:#e03131;font-weight:800;margin-right:6px;}
.prod-price-original{color:#aaa;font-size:12px;margin-right:6px;}
.prod-price-sale{font-size:16px;}
.prod-factory-price{font-size:13px;color:var(--gray3);margin:6px 0 2px;padding:0 14px;}
.prod-factory-price strong{color:var(--gray1);font-weight:800;}
.prod-dot-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 14px 14px;}
.prod-dot-card{background:#f8f9fb;border:1px solid var(--gray6);border-radius:10px;padding:10px;text-align:center;}
.prod-dot-label{font-size:12px;color:#666;margin:0 0 4px;}
.prod-dot-discount{display:inline-block;color:#e03131;font-weight:800;font-size:12px;margin-bottom:2px;}
.prod-dot-price{font-size:15px;font-weight:800;margin:2px 0;}
.prod-dot-stock{font-size:11px;color:#999;margin-bottom:6px;}
.btn-buy-now{width:100%;padding:6px;font-size:12px;border:none;border-radius:6px;background:var(--brand-color,#2f6fed);color:#fff;cursor:pointer;}
.btn-buy-now:disabled{background:#ccc;cursor:not-allowed;}
.prod-rating{margin:2px 14px 8px;font-size:12px;color:#f5a623;}

/* ===== 카테고리 탭 ===== */
.category-tabs{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.category-tabs .tab{
  padding:10px 20px;border-radius:999px;font-size:14px;font-weight:700;
  color:var(--gray3);background:#fff;border:1px solid var(--gray5)
}
.category-tabs .tab:hover{border-color:var(--gray1);color:var(--gray1)}
.category-tabs .tab.active{background:var(--gray1);color:#fff;border-color:var(--gray1)}

/* ===== 공장도가 확인 리스트 (tp-*) ===== */
.tp-wrap{max-width:1300px;margin:0 auto;padding:24px}
.tp-page-title{font-size:24px;font-weight:800;margin:14px 0 22px}
.tp-star{color:#ffb400}

.tp-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:22px}
.tp-card{background:#fff;border:1px solid #e6e8ec;border-radius:14px;padding:24px}

.tp-card-top{display:flex;align-items:flex-start;gap:14px}
.tp-brand-badge{
  flex-shrink:0;width:64px;height:40px;border-radius:6px;
  background:#222;color:#fff;font-size:14px;font-weight:700;
  display:flex;align-items:center;justify-content:center
}
.tp-name-block{flex:1}
.tp-name{font-size:20px;font-weight:800;color:#222;text-decoration:none}
.tp-spec{font-size:15px;color:#888;margin:4px 0 0}

.tp-qty-block{flex-shrink:0;text-align:right}
.tp-dc{font-size:15px;color:#666;margin-bottom:8px;display:flex;align-items:center;gap:6px;justify-content:flex-end}
.dc-input{
  width:52px;height:30px;text-align:center;border:1px solid #ddd;border-radius:5px;
  font-size:15px;padding:2px 0;color:#e6482e;font-weight:700
}
.dc-input:focus{outline:none;border-color:#ff6a3d}
.tp-qty-stepper{display:flex;align-items:center;gap:6px;font-size:15px;color:#666}
.qty-btn{width:28px;height:28px;border:1px solid #ddd;background:#fafafa;border-radius:5px;cursor:pointer;font-size:16px;line-height:1}
.qty-input{width:44px;height:28px;text-align:center;border:1px solid #ddd;border-radius:5px;font-size:15px;padding:2px 0}

.tp-factory-row{display:flex;justify-content:space-between;align-items:baseline;margin-top:18px}
.tp-factory-label{font-size:16px;color:#666}
.tp-factory-label strong{color:#333;font-weight:700}
.tp-main-price{font-size:28px;font-weight:800;color:#ff6a3d}

.tp-divider{border:none;border-top:1px solid #eee;margin:18px 0}

.tp-dot-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.tp-dot-box{background:#f9f9fa;border:1px solid #e5e7eb;border-radius:12px;padding:16px;text-align:center;transition:box-shadow .2s,transform .2s}
.tp-dot-box:hover{box-shadow:0 4px 14px rgba(0,0,0,.08);transform:translateY(-2px)}
.tp-dot-code{font-size:14px;color:#374151;margin:0 0 10px;font-weight:700;background:#e5e7eb;border-radius:8px;padding:6px 10px;display:inline-block}
.tp-dot-price-line{margin:0 0 8px;display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap}
.tp-dot-discount{color:#22c55e;font-weight:800;font-size:20px}
.tp-dot-price{font-size:18px;font-weight:800;color:#e6482e}
.tp-dot-stock{font-size:13px;color:#9ca3af;margin:0 0 12px}
.tp-dot-buy{width:100%;padding:10px;font-size:15px;border:none;border-radius:8px;background:#2f6fed;color:#fff;cursor:pointer}
.tp-dot-buy:disabled{background:#ccc;cursor:not-allowed}

.tp-nostock{text-align:center;padding:20px 0}
.tp-nostock p{font-size:16px;color:#999;margin-bottom:12px}
.tp-nostock-actions{display:flex;gap:10px;justify-content:center}
.btn-request-fill{background:#ff6a3d;color:#fff;border:none;border-radius:8px;padding:10px 20px;font-size:15px;cursor:pointer}
.btn-request-outline{background:#fff;border:1px solid #ddd;border-radius:8px;padding:10px 20px;font-size:15px;cursor:pointer}

/* ── [v46] 소비자용 상품 카드 (사진 참고 — 가격 중심, DOT·재고 수량 미노출) ── */
.tp-grid-consumer{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;margin-top:22px}
.tpc-card{
  display:flex;flex-direction:column;background:#fff;border:1px solid #e6e8ec;border-radius:16px;padding:14px;
  text-decoration:none;color:#222;transition:box-shadow .18s ease,transform .18s ease,border-color .18s ease;
}
.tpc-card:hover{box-shadow:0 8px 22px rgba(15,23,42,.10);transform:translateY(-3px);border-color:#c7d2fe}
.tpc-img{
  position:relative;background:#f4f5f8;border-radius:12px;aspect-ratio:4/3;
  display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:12px;
}
.tpc-img img{width:100%;height:100%;object-fit:cover;display:block}
/* 썸네일이 없을 때의 타이어형 플레이스홀더 (이모지 폰트 의존 없이 항상 동일하게 렌더) */
.tpc-img-ph{display:none;align-items:center;justify-content:center}
.tpc-noimg .tpc-img-ph{display:flex}
.tpc-noimg img{display:none}
.tpc-ph-tire{
  width:76px;height:76px;border-radius:50%;border:14px solid #4b5563;background:#f4f5f8;
  display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 3px #e5e7eb;
}
.tpc-ph-brand{font-size:12.5px;font-weight:800;color:#64748b;letter-spacing:.5px}
.tpc-meta{display:flex;align-items:center;justify-content:space-between;gap:8px}
.tpc-brand{font-size:13px;font-weight:800;color:#334155}
.tpc-rating{font-size:12px;color:#f59e0b;font-weight:800;white-space:nowrap}
.tpc-rev{color:#94a3b8;font-weight:600}
.tpc-model{font-size:15.5px;font-weight:800;color:#0f172a;margin:7px 0 2px;word-break:keep-all}
.tpc-size{font-size:14px;font-weight:800;color:#475569;margin:0 0 10px;letter-spacing:.2px}
.tpc-price{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.tpc-discount{font-size:16.5px;font-weight:900;color:#7c3aed}
.tpc-amount{font-size:17.5px;font-weight:900;color:#0f172a}
.tpc-orig{font-size:12.5px;color:#b6bcc7;font-weight:600}
.tpc-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}
.tpc-badge{font-size:11.5px;font-weight:700;color:#5b6472;background:#f1f3f6;border-radius:999px;padding:4px 9px}
.tpc-badge-svc{color:#4338ca;background:#eef2ff}
.tpc-badge-tag{color:#b45309;background:#fef3c7}
.tpc-badge-oos{color:#9ca3af;background:#f1f5f9}

@media (max-width:900px){
  .tp-grid{grid-template-columns:1fr}
  .tp-dot-row{grid-template-columns:1fr 1fr}
  /* [v46] 소비자 카드 — 태블릿 이하 2열 */
  .tp-grid-consumer{grid-template-columns:1fr 1fr;gap:12px}
}

/* ── 상품목록 필터바 ── */
.filter-bar-new { background:#fff; border:1px solid #e5e7eb; border-radius:8px; padding:16px; margin-bottom:16px; }
.fb-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.fb-brand-row { margin-bottom:14px; padding-bottom:14px; border-bottom:1px solid #f0f0f0; }
.fb-label { font-weight:600; color:#374151; min-width:56px; }
.fb-label-sm { font-size:12px; color:#6b7280; display:block; margin-bottom:4px; }
.fb-brand-list { display:flex; flex-wrap:wrap; gap:12px; flex:1; }
.fb-checkbox { display:inline-flex; align-items:center; gap:4px; font-size:14px; color:#374151; cursor:pointer; }
.fb-brand-hidden { display:none; }
.fb-more-btn { border:1px solid #16a34a; color:#16a34a; background:#fff; border-radius:6px; padding:6px 12px; font-size:13px; cursor:pointer; }
.fb-condition-row { align-items:flex-end; }
.fb-field { display:flex; flex-direction:column; }
.fb-field input, .fb-field select { border:1px solid #d1d5db; border-radius:6px; padding:8px 10px; font-size:14px; min-width:110px; }
.fb-field-wide input { min-width:180px; }
.fb-search-btn { background:#2563eb; color:#fff; border:none; border-radius:6px; padding:9px 18px; font-size:14px; cursor:pointer; }
.fb-stock-only { margin-left:auto; }
.filter-bar-sub { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }

/* 헤더 로고 — 위에서 정의됨, 여기서 중복 제거 */

/* ===== 리뷰 페이지 ===== */
.rv-wrap{max-width:var(--max-w);margin:0 auto;padding:32px 24px}
.rv-head{margin-bottom:20px}
.rv-title{font-size:24px;font-weight:900;color:var(--navy)}
.rv-summary{margin-top:6px;font-size:14px;color:var(--gray3)}
.rv-filter-bar{margin-bottom:20px}
.rv-filter-bar select{padding:8px 12px;border:1px solid var(--gray5);border-radius:var(--radius-sm);font-size:14px}
.rv-empty{padding:80px 0;text-align:center;color:var(--gray4)}
.rv-list{display:flex;flex-direction:column;gap:16px}
.rv-card{display:flex;gap:16px;background:var(--white);border-radius:var(--radius-md);padding:18px;box-shadow:var(--shadow-sm)}
.rv-card-thumb{flex:0 0 80px;width:80px;height:80px;border-radius:var(--radius-sm);overflow:hidden;background:var(--gray6);display:flex;align-items:center;justify-content:center}
.rv-card-thumb img{width:100%;height:100%;object-fit:cover}
.rv-card-thumb .ph{font-size:28px}
.rv-card-body{flex:1;min-width:0}
.rv-card-product{font-size:14px;font-weight:700;color:var(--navy)}
.rv-card-meta{display:flex;align-items:center;gap:10px;margin:6px 0;font-size:13px;color:var(--gray3)}
.rv-stars{color:#ffb400;letter-spacing:1px}
.rv-content{font-size:14px;color:var(--gray1);line-height:1.6;word-break:break-all}
.rv-card-img{margin-top:10px;max-width:160px;border-radius:var(--radius-sm);overflow:hidden}
.rv-card-img img{width:100%;display:block}
.rv-pagination{display:flex;justify-content:center;gap:6px;margin-top:28px}
.rv-page-btn{padding:8px 13px;border-radius:var(--radius-sm);border:1px solid var(--gray5);font-size:13px;color:var(--gray3)}
.rv-page-btn.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.rv-page-btn:hover{background:var(--gray6)}

/* ================================================
   이벤트/프로모션 가로 스크롤 카드 (별도 용도, 홈 배너와 무관 — 유지)
   ================================================ */
.banner-scroll-wrap{
  position:relative;
  max-width:1200px;
  margin:0 auto;
  padding:16px 20px 0;
}
.banner-scroll{
  display:flex;
  gap:14px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  scroll-snap-type:x proximity;
  padding:4px 4px 12px;
}
.banner-scroll::-webkit-scrollbar{display:none;}

.banner-scroll-card{
  position:relative;
  flex:0 0 280px;
  height:150px;
  border-radius:16px;
  overflow:hidden;
  background:#e5e7eb;
  box-shadow:0 3px 10px rgba(17,24,39,.08);
  scroll-snap-align:start;
  transition:transform .18s ease, box-shadow .18s ease;
}
.banner-scroll-card:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 18px rgba(17,24,39,.14);
}
.banner-scroll-card img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

.banner-scroll-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.92);color:#111827;font-size:18px;
  display:flex;align-items:center;justify-content:center;
  z-index:5;box-shadow:0 2px 8px rgba(0,0,0,.18);border:none;cursor:pointer;
  transition:background .2s, transform .2s;
}
.banner-scroll-nav:hover{background:#fff;transform:translateY(-50%) scale(1.08);}
.banner-scroll-prev{left:6px;}
.banner-scroll-next{right:6px;}

@media (max-width:900px){
  .banner-scroll-card{flex:0 0 240px;height:128px;}
}
@media (max-width:640px){
  .banner-scroll-wrap{padding:10px 12px 0;}
  .banner-scroll{gap:10px;}
  .banner-scroll-card{flex:0 0 210px;height:112px;border-radius:12px;}
  .banner-scroll-nav{display:none;}
}

/* ===== 로그인/회원가입 카드 ===== */
.auth-page{
  min-height:calc(100vh - 220px);
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#eef4ff 0%,#f7fbff 100%);
  padding:60px 20px;
}
.auth-card{
  width:100%;max-width:420px;background:#fff;border-radius:20px;
  padding:44px 40px;box-shadow:0 10px 30px rgba(30,58,138,.08);
}
.auth-view{display:none}
.auth-view.active{display:block;animation:authFadeIn .25s ease}
@keyframes authFadeIn{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(0)}
}
.auth-card-title{
  text-align:center;font-size:20px;font-weight:700;color:var(--gray2,#4b5563);
  margin-bottom:28px;
}
.auth-field{
  display:block;width:100%;height:48px;margin-bottom:14px;padding:0 16px;
  background:#f3f6fb;border:1px solid transparent;border-radius:10px;
  font-size:14px;color:var(--gray1,#111827);
}
.auth-field::placeholder{color:#9aa5b1}
.auth-field:focus{outline:none;border-color:var(--navy);background:#fff}
.btn-auth-primary{
  display:block;width:100%;height:50px;margin-top:6px;
  background:var(--navy);color:#fff;border:none;border-radius:10px;
  font-size:15px;font-weight:700;cursor:pointer;
}
.btn-auth-primary:hover{background:#1e293b}
.auth-links-row{
  display:flex;align-items:center;justify-content:center;gap:10px;
  margin-top:22px;font-size:13px;color:var(--gray3,#6b7280);
}
.auth-links-row a{color:var(--gray3,#6b7280);text-decoration:none}
.auth-links-row a:hover{color:var(--navy);text-decoration:underline}
.auth-links-divider{color:var(--gray5,#d1d5db)}
.auth-switch-link{color:var(--navy) !important;font-weight:700}

.phone-verify-row{display:flex;gap:8px;margin-bottom:14px}
.phone-verify-row .auth-field{margin-bottom:0}
/* [FIX] 전역 .btn-outline 재사용 충돌 방지 → 이 컴포넌트 안에서만 적용되게 스코프 */
.phone-verify-row .btn-outline{
  flex:0 0 auto;height:48px;padding:0 14px;background:#fff;border:1px solid var(--navy);
  color:var(--navy);border-radius:10px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;
}
.phone-verify-row .btn-outline:hover{background:#f3f4f6}
.phone-verify-row .btn-outline:disabled{opacity:.5;cursor:not-allowed}
.code-timer{align-self:center;font-size:12px;color:#ef4444;white-space:nowrap}
.verify-msg{font-size:12px;margin:-6px 0 12px;min-height:14px}
.verify-msg.success{color:#16a34a}
.verify-msg.error{color:#ef4444}
.auth-divider{border:none;border-top:1px solid var(--gray5,#e5e7eb);margin:18px 0}
.biz-title{font-size:14px;font-weight:800;color:var(--navy);margin-bottom:12px}
.checkbox-line{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--gray3);margin:14px 0}
.error-list{color:#ef4444;font-size:13px;margin-bottom:14px;padding-left:16px}
.success-msg{color:#16a34a;font-size:13px;margin-bottom:14px;text-align:center}
/* [FIX] 위쪽 .auth-wrap .error-msg 스타일과 충돌하지 않도록 .auth-card 안에서만 적용되게 스코프 */
.auth-card .error-msg{color:#ef4444;font-size:13px;margin-bottom:14px;text-align:center}

@media (max-width: 480px){
  .auth-card{padding:32px 24px}
}
.terms-agree-box{border:1px solid var(--gray5);border-radius:8px;padding:14px;margin:14px 0;background:#f9fafb}
.terms-agree-box .checkbox-line{display:flex;align-items:center;gap:8px;font-size:13px;margin-bottom:8px}
.terms-agree-box .checkbox-line:first-child{border-bottom:1px solid var(--gray5);padding-bottom:8px;margin-bottom:10px;font-size:14px}
.terms-agree-box a{color:var(--navy);text-decoration:underline}
.policy-wrap{max-width:760px;margin:0 auto;padding:40px 24px 80px}
.policy-title{font-size:24px;font-weight:800;margin-bottom:28px}
.policy-section{margin-bottom:24px}
.policy-section h2{font-size:16px;font-weight:700;margin-bottom:8px;color:var(--navy)}
.policy-section p{font-size:14px;line-height:1.7;color:#374151}
.tt-footer-links{margin-bottom:10px;font-size:13px}
.tt-footer-links a{color:#d1d5db;text-decoration:none}
.tt-footer-links a:hover{color:#fff}
.tt-footer-privacy{font-weight:700;color:#ffffff!important}
.tt-footer-divider{color:#4b5563;margin:0 6px}

/* ===============================================================
   [교체] 메인 배너 — 카드형 슬라이더
   관리자에서 배너별로 target_w × target_h 픽셀을 직접 지정 (기본값 1200×400)
   → index.php가 인라인 style="aspect-ratio:tw/th"로 실제 값을 덮어씀
   화면 전체 폭 풀블리드가 아니라 콘텐츠 영역(max-width:1240px) 안에서 카드처럼 표시
   =============================================================== */
.banner-card-sec{padding:24px 24px 0;background:#fff;}
.banner-card-wrap{
  position:relative;width:100%;
  border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:var(--shadow-md);background:#111827;
  aspect-ratio:1200/400; /* 기본값. 실제 값은 PHP 인라인 style로 배너별 덮어씀 */
}
.banner-card-track{position:relative;width:100%;height:100%;}
.banner-card-slide{
  position:absolute;inset:0;width:100%;height:100%;
  opacity:0;visibility:hidden;
  transition:opacity .5s ease,visibility 0s .5s;
  pointer-events:none;z-index:1;
}
.banner-card-slide.active{
  opacity:1;visibility:visible;
  transition:opacity .5s ease,visibility 0s;
  pointer-events:auto;z-index:2;
}
.banner-card-link{display:block;width:100%;height:100%;}
.banner-card-img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;}
.banner-card-nav{
  position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;
  border:none;background:rgba(255,255,255,.9);color:#111827;font-size:18px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.banner-card-nav:hover{background:#fff;}
.banner-card-nav-prev{left:16px;}
.banner-card-nav-next{right:16px;}
.banner-card-dots{
  position:absolute;bottom:14px;left:0;right:0;
  display:flex;justify-content:center;gap:8px;z-index:10;
}
.banner-card-dot{
  width:8px;height:8px;border-radius:50%;border:none;
  background:rgba(255,255,255,.55);padding:0;cursor:pointer;
  transition:width .2s,background .2s;
}
.banner-card-dot.active{background:#fff;width:22px;border-radius:5px;}

@media (max-width:640px){
  .banner-card-nav{width:32px;height:32px;font-size:15px;}
  .banner-card-nav-prev{left:8px;}
  .banner-card-nav-next{right:8px;}
}

/* ===============================================================
   카테고리 아이콘 바 — tire-pick.com 스타일 가로 나열 (중복 3종 정리 후 최종본)
   =============================================================== */
.category-icon-sec{padding:24px 24px 0;background:#fff;}
.category-icon-bar{display:flex;gap:20px;overflow-x:auto;padding:8px 0;scrollbar-width:none;}
.category-icon-bar::-webkit-scrollbar{display:none;}
.category-icon-item{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px;width:88px;text-align:center;text-decoration:none;}
.category-icon-img-wrap{width:72px;height:92px;border-radius:14px;overflow:hidden;background:#f3f4f6;box-shadow:var(--shadow-sm);}
.category-icon-img-wrap img{width:100%;height:100%;object-fit:cover;}
.category-icon-label{font-size:12px;font-weight:700;color:var(--gray1);line-height:1.3;}

/* ===============================================================
   카드형 프로모 배너 그리드 — 가로 스크롤 (중복 3종 정리 후 최종본)
   =============================================================== */
.promo-grid-sec{padding:24px 24px 0;background:#fff;}
.promo-grid-wrap{position:relative;}
.promo-grid{display:flex;gap:16px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;padding-bottom:4px;}
.promo-grid::-webkit-scrollbar{display:none;}
.promo-card{
  flex:0 0 320px;height:210px;border-radius:var(--radius-md);background-size:cover;background-position:center;
  position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:18px;color:#fff;
  text-decoration:none;box-shadow:var(--shadow-sm);
}
.promo-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.55) 100%);}
.promo-title{position:relative;z-index:1;font-size:17px;font-weight:800;margin-bottom:4px;}
.promo-desc{position:relative;z-index:1;font-size:12px;opacity:.9;margin-bottom:8px;}
.promo-cta{position:relative;z-index:1;font-size:12px;font-weight:700;align-self:flex-start;background:rgba(255,255,255,.2);
  padding:4px 10px;border-radius:999px;}
.promo-scroll-nav{
  position:absolute;bottom:2px;width:32px;height:32px;border-radius:50%;
  border:none;background:rgba(255,255,255,.92);color:#111827;font-size:16px;
  display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.15);z-index:5;cursor:pointer;
  transition:background .2s,transform .2s;
}
.promo-scroll-nav:hover{background:#fff;transform:scale(1.06);}
.promo-scroll-prev{right:58px;}
.promo-scroll-next{right:20px;}

/* 컬러 폴백 (이미지 없을 때) */
.promo-card.promo-blue{background:linear-gradient(135deg,#1e3a8a 0%,#3b82f6 100%);}
.promo-card.promo-green{background:linear-gradient(135deg,#14532d 0%,#22c55e 100%);}
.promo-card.promo-orange{background:linear-gradient(135deg,#7c2d12 0%,#f97316 100%);}
.promo-card.promo-dark{background:linear-gradient(135deg,#18181b 0%,#3f3f46 100%);}
.promo-card.promo-red{background:linear-gradient(135deg,#7f1d1d 0%,#ef4444 100%);}
.promo-card.promo-purple{background:linear-gradient(135deg,#581c87 0%,#a855f7 100%);}

@media (max-width:900px){
  .promo-card{flex:0 0 260px;height:170px;padding:14px;}
}
@media (max-width:480px){
  .promo-grid{padding-bottom:4px;gap:10px;}
  .promo-card{flex:0 0 240px;height:160px;padding:14px;border-radius:12px;}
  .promo-title{font-size:15px;}
  .promo-cta{padding:3px 9px;font-size:11px;}
  .promo-scroll-nav{display:none;}
}

/* ===============================================================
   BEST 섹션 바로 위 와이드 카드 배너 (관리자에서 등록한 실사진, 중복 정리 후 최종본)
   =============================================================== */
.besttop-banner-sec{padding:24px 24px 0;background:#fff;}
.besttop-banner-card{
  display:block;width:100%;aspect-ratio:1200/300;min-height:120px;max-height:280px;
  border-radius:var(--radius-lg);background-size:cover;background-position:center;
  position:relative;overflow:hidden;padding:24px;color:#fff;text-decoration:none;box-shadow:var(--shadow-sm);
}
.besttop-banner-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,transparent 60%);}
.besttop-banner-title{position:relative;z-index:1;font-size:22px;font-weight:900;margin-bottom:6px;}
.besttop-banner-desc{position:relative;z-index:1;font-size:13px;opacity:.9;margin-bottom:12px;}
.besttop-banner-cta{position:relative;z-index:1;font-size:13px;font-weight:700;background:rgba(255,255,255,.2);
  padding:6px 14px;border-radius:999px;display:inline-block;}

@media (max-width:768px){
  .banner-card-wrap{border-radius:var(--radius-md);}
  .category-icon-sec,.promo-grid-sec,.besttop-banner-sec{padding:14px 14px 0;}
  .besttop-banner-title{font-size:17px;}
}
/* ===== 회원가입/로그인 인증 카드 (신규 — 기존 파일에 누락되어 있던 스타일) ===== */
.auth-page{max-width:480px;margin:60px auto;padding:0 20px}
.auth-card{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:40px 36px}
.auth-card-title{font-size:22px;font-weight:900;color:var(--gray1);text-align:center;margin-bottom:24px}

.auth-view{display:none}
.auth-view.active{display:block}

.auth-field{
  width:100%;height:46px;border:1px solid var(--gray5);border-radius:var(--radius-sm);
  padding:0 14px;font-size:14px;margin-bottom:12px;background:#fff;color:var(--gray1);
}
.auth-field:focus{outline:none;border-color:var(--primary)}
.auth-field[readonly]{background:var(--gray6);color:var(--gray3);cursor:default}

.btn-auth-primary{
  width:100%;height:50px;background:var(--primary);color:#fff;border:none;
  border-radius:var(--radius-sm);font-weight:800;font-size:15px;margin-top:8px;
}
.btn-auth-primary:hover{background:var(--primary-dark)}

.auth-links-row{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:18px;font-size:13px;color:var(--gray3)}
.auth-links-row a{color:var(--gray3)}
.auth-links-row a:hover{color:var(--primary)}
.auth-links-divider{color:var(--gray5)}
.auth-switch-link{color:var(--primary) !important;font-weight:700}
.auth-divider{border:none;border-top:1px solid var(--gray5);margin:20px 0}
.biz-title{font-size:14px;font-weight:800;color:var(--gray1);margin-bottom:12px}

/* 인라인 확인 버튼 행 — 휴대폰 인증/사업자번호 확인/주소찾기 공용 스타일 */
.inline-verify-row{display:flex;gap:8px;margin-bottom:10px}
.inline-verify-row .auth-field{margin-bottom:0;flex:1;min-width:0}

.btn-verify{
  flex-shrink:0;height:46px;padding:0 16px;border:1px solid var(--gray1);border-radius:var(--radius-sm);
  background:#fff;color:var(--gray1);font-weight:700;font-size:13px;white-space:nowrap;
  transition:background .15s,color .15s;
}
.btn-verify:hover{background:var(--gray1);color:#fff}
.btn-verify:disabled{opacity:.5;cursor:not-allowed}
.btn-verify.confirmed{background:#dcfce7;border-color:#22c55e;color:#15803d}
.btn-verify.confirmed:hover{background:#dcfce7;color:#15803d}

.phone-verify-row{display:flex;gap:8px;margin-bottom:10px}
.phone-verify-row .auth-field{margin-bottom:0}
.code-timer{align-self:center;font-size:12px;color:var(--primary);white-space:nowrap}

.verify-msg{font-size:12px;color:var(--gray3);margin:-4px 0 10px 2px;min-height:14px}
.verify-msg.success{color:#15803d;font-weight:700}
.verify-msg.error{color:var(--primary-dark);font-weight:700}

.terms-agree-box{background:var(--gray6);border-radius:var(--radius-sm);padding:16px;margin:18px 0}
.checkbox-line{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--gray3);padding:6px 0}
.checkbox-line a{color:var(--gray1);text-decoration:underline}
.agree-divider{border:none;border-top:1px solid var(--gray5);margin:6px 0}

.error-list{
  background:#fef2f2;border-radius:var(--radius-sm);padding:12px 16px 12px 32px;
  margin-bottom:16px;color:var(--primary-dark);font-size:13px;list-style:disc;
}

@media (max-width:480px){
  .auth-card{padding:32px 22px}
  .inline-verify-row{flex-direction:column}
  .btn-verify{height:44px;width:100%}
}
/* ===== 브랜드별 베스트셀러 섹션 (어드민에서 여러 개 생성 가능) ===== */
.brand-best-sec{padding:40px 24px}
.brand-best-head{margin-bottom:20px}
.brand-best-kicker{font-size:13px;font-weight:800;color:var(--primary);margin-bottom:6px}
.brand-best-title-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.brand-best-title{font-size:22px;font-weight:900;color:var(--gray1)}
.brand-best-viewall{font-size:13px;font-weight:700;color:var(--gray3);white-space:nowrap}
.brand-best-viewall:hover{color:var(--primary)}
.brand-best-sub{font-size:13px;color:var(--gray4);margin-top:6px}
/* ===================== 메인 하단 리뷰 섹션 ===================== */
.home-review-section{max-width:1200px;margin:0 auto;padding:60px 20px 80px;}
.home-review-head{margin-bottom:24px;}
.home-review-kicker{font-size:13px;font-weight:700;color:#0d9488;margin:0 0 6px;}
.home-review-title{font-size:24px;font-weight:800;color:#0f172a;margin:0 0 6px;}
.home-review-sub{font-size:14px;color:#94a3b8;margin:0;}

.home-review-scroll{
  display:flex;
  gap:16px;
  overflow-x:auto;
  padding-bottom:8px;
  scroll-snap-type:x proximate;
  cursor:grab;
  scrollbar-width:none;
}
.home-review-scroll::-webkit-scrollbar{display:none;}
.home-review-scroll.dragging{cursor:grabbing;user-select:none;}

.home-review-card{
  flex:0 0 auto;
  width:270px;
  background:#fff;
  border:1px solid #eef2f7;
  border-radius:18px;
  padding:18px;
  box-shadow:0 4px 14px rgba(15,23,42,.05);
  scroll-snap-align:start;
}
.home-review-card-top{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.home-review-thumb{width:44px;height:44px;border-radius:10px;background:#f1f5f9;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.home-review-thumb img{width:100%;height:100%;object-fit:cover;}
.home-review-thumb-ph{font-size:20px;}
.home-review-product-info{min-width:0;}
.home-review-brand-chip{display:inline-block;background:#f0fdfa;color:#0d9488;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;margin-bottom:4px;}
.home-review-product-name{font-size:13px;font-weight:700;color:#334155;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.home-review-stars{color:#fbbf24;font-size:15px;letter-spacing:1px;margin-bottom:10px;}
.home-review-content{font-size:14px;line-height:1.6;color:#1e293b;margin:0 0 14px;min-height:66px;}
.home-review-meta{display:flex;align-items:center;gap:6px;font-size:12px;color:#94a3b8;}
.home-review-dot{color:#e2e8f0;}

@media (max-width:640px){
  .home-review-card{width:230px;}
  .home-review-title{font-size:20px;}
}
/* ===== [NEW] 홈 리뷰카드 — <a> 태그화 + 뱃지/사진 (review-list.php와 톤 통일) ===== */
.home-review-card{display:block;color:inherit;text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s;}
.home-review-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(15,23,42,.10);}
.home-review-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;}
.home-review-badge{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;}
.home-review-badge.service{background:#eef2ff;color:#4338ca;}
.home-review-badge.option{background:#f0fdf4;color:#15803d;}
.home-review-photos{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap;}
.home-review-photos img{width:56px;height:56px;object-fit:cover;border-radius:8px;}

/* ===== [NEW] product-detail.php 리뷰 직접 이동 시 강조 효과 ===== */
.pd-review-item.pd-review-highlight{
  background:#f5f5ff;border-radius:14px;
  box-shadow:0 0 0 2px #6366f1 inset;
  transition:background .3s ease;
}

/* ================================================================
   [NEW] 회원 유형 배지 (헤더)
   ================================================================ */
.tt-user-type-badge{
  font-size:11px;font-weight:800;padding:3px 10px;border-radius:999px;
  background:#e0e7ff;color:#4338ca;white-space:nowrap;
}
.tt-user-type-badge.biz{background:#fef3c7;color:#92400e;}
.tt-signup-link{font-weight:800;color:var(--primary)!important;}

/* ================================================================
   [NEW] 회원가입 탭 (일반/사업자)
   ================================================================ */
.auth-member-tabs{
  display:flex;gap:0;margin-bottom:24px;border-bottom:2px solid var(--gray5,#e5e7eb);
}
.auth-member-tab{
  flex:1;padding:12px 8px;font-size:14px;font-weight:700;color:var(--gray4,#9ca3af);
  background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;
  cursor:pointer;transition:color .15s,border-color .15s;
}
.auth-member-tab:hover{color:var(--gray1,#111827);}
.auth-member-tab.active{color:var(--primary,#ff4757);border-bottom-color:var(--primary,#ff4757);}

/* ================================================================
   [NEW] 사업자 우대가 표시
   ================================================================ */
.pdh-biz-price-notice{margin-bottom:8px;}
.pdh-biz-badge{
  display:inline-block;font-size:12px;font-weight:800;padding:4px 12px;
  border-radius:999px;background:#fef3c7;color:#92400e;
}
.badge-biz{background:#f59e0b!important;color:#fff!important;}

/* 사업자 공급가 정보 */
.pdh-biz-supply-info{margin-top:8px;font-size:12px;color:#92400e;font-weight:600;}

/* ================================================================
   [NEW] 상품 카드 사업자가 뱃지
   ================================================================ */
.prod-badge.badge-biz{background:#f59e0b;}

/* ================================================================
   [NEW] 모바일 햄버거 메뉴 (반응형 개선)
   ================================================================ */
.tt-mobile-menu-btn{
  display:none;width:40px;height:40px;border:none;background:none;
  font-size:24px;cursor:pointer;color:var(--gray1,#111827);align-items:center;justify-content:center;
}
.tt-mobile-menu{
  display:flex;visibility:hidden;position:fixed;top:0;left:0;width:280px;height:100vh;
  background:#fff;z-index:10001;box-shadow:4px 0 20px rgba(0,0,0,.15);
  transform:translateX(-100%);transition:transform .25s ease,visibility .25s;
  flex-direction:column;padding:20px 0;overflow-y:auto;
}
.tt-mobile-menu.open{visibility:visible;transform:translateX(0);}
/* 노치 단말 — 메뉴 상단/하단도 안전영역 확보 */
.tt-mobile-menu{padding-top:calc(20px + env(safe-area-inset-top, 0px));padding-bottom:calc(20px + env(safe-area-inset-bottom, 0px));}
.tt-mobile-menu-overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:10000;
}
.tt-mobile-menu-overlay.open{display:block;}
.tt-mobile-menu .tt-mobile-close{
  position:absolute;top:16px;right:16px;font-size:24px;background:none;border:none;cursor:pointer;
}
.tt-mobile-menu a{
  display:block;padding:14px 24px;font-size:15px;font-weight:700;color:var(--gray1,#111827);
  border-bottom:1px solid var(--gray6,#f3f4f6);text-decoration:none;
}
.tt-mobile-menu a:hover{background:var(--gray6,#f3f4f6);}

/* ================================================================
   [NEW] 전체 반응형 개선 (타이어핑/타이어픽 벤치마킹)
   ================================================================ */

/* 태블릿 (768~1024px) */
@media (max-width:1024px){
  .tt-header-inner{gap:16px;padding:0 20px;height:64px;}
  .tt-nav{gap:16px;}
  .tt-nav a{font-size:14px;}
  .tt-header-search{max-width:200px;margin:0 8px;}
  .tt-logo-img{height:48px;}
  .prod-grid{grid-template-columns:repeat(3,1fr);gap:14px;}
  .sec-inner{padding:0 20px;}
  .rec-sec{padding:36px 0;}
  .sec-title{font-size:20px;}
  .pdh-wrap{padding:20px 16px 0;}
  .pdh-grid{gap:24px;}
  .tp-wrap{padding:16px;}
  .tp-grid{gap:16px;}
  .rvl-wrap{padding:20px 12px 48px;gap:20px;}
  .rvl-sidebar{width:160px;}
  .rvl-card-right{width:180px;}
}

/* 모바일 (480~767px) */
@media (max-width:768px){
  .tt-utilbar{font-size:11px;height:30px;}
  .tt-utilbar-inner{padding:0 16px;gap:10px;}
  .tt-header-inner{height:auto;min-height:60px;padding:10px 16px;flex-wrap:wrap;gap:12px;}
  .tt-nav{display:none;}
  .tt-mobile-menu-btn{display:flex;}
  .tt-header-search{order:3;flex-basis:100%;max-width:100%;margin:0;}
  .tt-header-actions{font-size:13px;gap:12px;}
  .tt-logo-img{height:36px;}
  .tt-cart-link{font-size:13px;}

  .banner-card-sec{padding:16px 12px 0;}
  .banner-card-wrap{border-radius:12px;}
  .banner-card-nav{width:32px;height:32px;font-size:15px;}
  .banner-card-nav-prev{left:8px;}
  .banner-card-nav-next{right:8px;}

  .category-icon-sec{padding:16px 12px 0;}
  .category-icon-bar{gap:12px;}
  .category-icon-item{width:72px;}
  .category-icon-img-wrap{width:60px;height:78px;}

  .promo-grid-sec{padding:16px 12px 0;}
  .promo-card{flex:0 0 240px;height:160px;padding:14px;border-radius:12px;}
  .promo-scroll-nav{display:none;}

  .besttop-banner-sec{padding:16px 12px 0;}
  .besttop-banner-card{min-height:100px;padding:18px;border-radius:12px;}
  .besttop-banner-title{font-size:16px;}
  .besttop-banner-desc{font-size:12px;}

  .prod-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
  .prod-grid .prod-body{padding:10px;}
  .prod-grid .prod-title{font-size:13px;min-height:34px;}
  .prod-grid .prod-price-now{font-size:16px;}
  .prod-grid .prod-discount-pct{font-size:14px;}
  .sec-title{font-size:18px;margin-bottom:14px;}
  .rec-sec{padding:28px 0;}
  .sec-inner{padding:0 12px;}

  .brand-best-sec{padding:28px 0;}
  .brand-best-title{font-size:18px;}
  .brand-best-viewall{font-size:12px;}

  .home-review-section{padding:40px 12px 60px;}
  .home-review-card{width:220px;padding:14px;}
  .home-review-title{font-size:18px;}
  .home-review-content{font-size:13px;min-height:56px;}

  /* 상품 상세페이지 모바일 */
  .pdh-wrap{padding:16px 12px 0;}
  .pdh-grid{grid-template-columns:1fr;gap:20px;}
  .pdh-gallery-row{flex-direction:column;}
  .pdh-badge-side{width:100%;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;gap:10px;}
  .pdh-badge-grade{width:auto;padding:8px 16px;font-size:15px;}
  .pdh-badge-services{flex-direction:row;gap:14px;border-top:none;padding-top:0;}
  .pdh-badge-consult{flex-direction:row;border-top:none;padding-top:0;}
  .pdh-title{font-size:20px;}
  .pdh-final-price{font-size:24px;}
  .pdh-buy-btn{height:44px;font-size:14px;}
  .pdh-icon-btn{width:42px;height:42px;font-size:18px;}
  .pd-tabs{padding:0 12px;}
  .pd-tab-btn{padding:10px 14px;font-size:14px;}
  .pd-tab-panel{padding:20px 12px 40px;}
  .pd-spec-table th{padding:10px 12px;}
  .pd-spec-table td{padding:10px 12px;}

  /* 공장도가 확인(상품목록) 모바일 */
  .tp-wrap{padding:12px;}
  .tp-page-title{font-size:20px;}
  .tp-grid{grid-template-columns:1fr;gap:16px;}
  .tp-card{padding:16px;}
  .tp-card-top{flex-wrap:wrap;}
  .tp-qty-block{width:100%;margin-top:10px;}
  .tp-dot-row{grid-template-columns:1fr 1fr;gap:10px;}
  .tp-dot-box{padding:12px;}
  .tp-dot-price{font-size:16px;}
  .tp-dot-buy{font-size:14px;padding:8px;}
  /* [v46] 소비자 카드 — 모바일 2열 유지 + 요소 축소 */
  .tp-grid-consumer{grid-template-columns:1fr 1fr;gap:10px;}
  .tpc-card{padding:10px;}
  .tpc-model{font-size:13.5px;margin-top:5px;}
  .tpc-size{font-size:12.5px;margin-bottom:8px;}
  .tpc-discount{font-size:14.5px;}
  .tpc-amount{font-size:15.5px;}
  .tpc-orig{font-size:11px;}
  .tpc-badge{font-size:10.5px;padding:3px 7px;}
  .tpc-img{margin-bottom:9px;}
  .filter-bar-new{padding:12px;}
  .fb-row{flex-wrap:wrap;}
  .fb-field{min-width:100%;margin-bottom:8px;}
  .fb-field input,.fb-field select{width:100%;min-width:0;}
  .fb-search-btn{width:100%;}

  /* 리뷰 모아보기 모바일 */
  .rvl-wrap{flex-direction:column;padding:16px 12px 40px;gap:16px;}
  .rvl-sidebar{width:100%;border-right:none;border-bottom:1px solid #eee;padding-right:0;padding-bottom:12px;}
  .rvl-sidebar-title{margin-bottom:8px;}
  .rvl-brand-item{white-space:nowrap;border-bottom:none;padding:8px;}
  .rvl-main{width:100%;}
  .rvl-card{flex-direction:column;gap:14px;padding:16px 0;}
  .rvl-card-right{width:100%;border-left:none;border-top:1px solid #f0f0f0;padding-left:0;padding-top:12px;flex-direction:row;flex-wrap:wrap;align-items:center;}
  .rvl-product-thumb{margin-bottom:0;}
  .rvl-service-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:10px;}
  .rvl-tab{white-space:nowrap;}

  /* 마이페이지 모바일 */
  .mypage-wrap{flex-direction:column;padding:20px 12px;gap:16px;}
  .mypage-side{width:100%;}
  .mypage-tabs{display:flex;overflow-x:auto;scrollbar-width:none;}
  .mypage-tabs::-webkit-scrollbar{display:none;}
  .mypage-tabs a{white-space:nowrap;border-bottom:none;border-right:1px solid var(--gray6,#f3f4f6);}
  .mypage-tabs a.active{border-right-color:var(--primary,#ff4757);}
  .mypage-section{padding:20px 16px;}
  .order-table{font-size:12px;}
  .order-table th,.order-table td{padding:8px 4px;}
  .wish-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
  .review-write-grid{grid-template-columns:1fr;}
  .my-review-item{grid-template-columns:56px 1fr;gap:10px;}
  .mr-thumb{width:56px;height:56px;}
  .coupon-box-grid{grid-template-columns:1fr;}

  /* 장바구니 모바일 */
  .cart-wrap{padding:20px 12px 60px;}
  .cart-item{flex-wrap:wrap;padding:14px;gap:12px;}
  .cart-item-img{width:72px;height:72px;}
  .cart-item-info{flex:1;min-width:calc(100% - 84px);}
  .cart-item-qty{order:2;}
  .cart-item-price{width:100%;text-align:left;margin-top:8px;}

  /* 결제 모바일 */
  .checkout-wrap{padding:20px 12px 60px;}
  .checkout-section{padding:16px;}

  /* 어드민 모바일 */
  .admin-layout{flex-direction:column;}
  .admin-sidebar{width:100%;height:auto;position:relative;flex-direction:row;overflow-x:auto;}
  .admin-nav{flex-direction:row;overflow-x:auto;}
  .admin-nav a{white-space:nowrap;border-left:none;border-bottom:3px solid transparent;}
  .admin-nav a.active{border-left:none;border-bottom-color:var(--adm-primary);}
  .admin-content{width:100%;}
  .admin-sidebar-footer{display:none;}
}

/* 작은 모바일 (480px 이하) */
@media (max-width:480px){
  .prod-grid{grid-template-columns:1fr 1fr;gap:8px;}
  .prod-grid .prod-body{padding:8px;}
  .prod-grid .prod-title{font-size:12px;-webkit-line-clamp:1;min-height:18px;}
  .prod-grid .prod-price-now{font-size:15px;}
  .prod-grid .prod-discount-pct{font-size:13px;}
  .prod-grid .prod-brand-name{font-size:10px;}
  .prod-grid .prod-rating{font-size:10px;}

  .auth-card{padding:28px 20px;border-radius:16px;}
  .auth-member-tab{font-size:13px;padding:10px 4px;}

  .tp-dot-row{grid-template-columns:1fr;}
  .tp-dot-box{padding:10px;}

  .banner-card-nav{width:28px;height:28px;font-size:13px;}
  .banner-card-dots .banner-card-dot{width:6px;height:6px;}
  .banner-card-dot.active{width:16px;}

  .home-review-card{width:200px;padding:12px;}
  .home-review-content{font-size:12px;min-height:48px;}

  .pdh-title{font-size:18px;}
  .pdh-final-price{font-size:22px;}
  .pdh-action-row{gap:8px;}
  .pdh-icon-btn{width:40px;height:40px;}
  .pdh-buy-btn{font-size:13px;height:42px;}

  .rvl-promo-banner{padding:14px 18px;}
  .rvl-promo-text strong{font-size:14px;}
  .rvl-promo-text span{font-size:11px;}

  .mypage-section h2{font-size:16px;}
  .order-table{font-size:11px;}
  .order-table th,.order-table td{padding:6px 2px;}
}

/* ================================================================
   [NEW] 리뷰 모달 모바일 개선
   ================================================================ */
@media (max-width:480px){
  .review-modal-overlay{padding:0;}
  .review-modal-box{width:100%;max-width:100%;border-radius:0;min-height:100vh;max-height:100vh;}
  .review-modal-head{padding:20px 20px 0;}
  .review-modal-title{font-size:17px;}
  .review-modal-scroll{padding:0 20px;}
  .review-modal-actions{padding:12px 20px 20px;}
  .btn-modal-cancel,.btn-modal-submit{font-size:13px;padding:10px 18px;}
  .star-rating label{font-size:28px;}
  .rv-chip-label{padding:7px 12px;font-size:12px;}
  .rv-photo-upload-wrap input[type=file]{font-size:12px;}
}

/* ================================================================
   [NEW] 모바일 하단 고정 액션바 (상품 상세)
   ================================================================ */
@media (max-width:768px){
  .pdh-action-row{
    position:fixed;bottom:0;left:0;right:0;z-index:9001;
    background:#fff;padding:10px 12px;box-shadow:0 -4px 12px rgba(0,0,0,.08);
    border-top:1px solid #e5e7eb;gap:8px;
  }
  .pdh-benefit-box{display:none;}
  .pdh-total-row{margin-bottom:12px;}
  body{padding-bottom:70px;}
}

/* ================================================================
   [NEW v3] 사업자 승인제 + 트렌디 디자인 개선
   ================================================================ */

/* 사업자 승인 안내 박스 (로그인 페이지) */
.biz-approval-notice{
  background:linear-gradient(135deg,#fef3c7,#fde68a);
  border:1px solid #f59e0b;
  border-radius:12px;padding:14px 16px;margin-bottom:20px;
}
.biz-approval-notice strong{display:block;font-size:14px;color:#92400e;margin-bottom:4px;}
.biz-approval-notice p{font-size:13px;color:#78350f;margin:0;line-height:1.5;}

/* 헤더 회원 유형 배지 */
.tt-user-type-badge{
  font-size:11px;font-weight:800;padding:3px 10px;border-radius:6px;
  background:#dbeafe;color:#1d4ed8;white-space:nowrap;
}
.tt-user-type-badge.biz{background:#fef3c7;color:#92400e;}
.tt-signup-link{font-weight:800;color:#2563eb!important;}

/* ================================================================
   [NEW v17] 모바일 앱 (PWA) — 하단 탭바 + 앱 전용화면 스타일
   ================================================================ */
.tt-app-tabbar{
  display:none;
  position:fixed;bottom:0;left:0;right:0;z-index:9200;
  background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(16px);
  -webkit-backdrop-filter:saturate(180%) blur(16px);
  border-top:1px solid #e2e8f0;
  padding:6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
  justify-content:space-around;
  box-shadow:0 -2px 12px rgba(0,0,0,.06);
}
.tt-tab-item{
  position:relative;flex:1;max-width:96px;
  display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:4px 0;text-decoration:none;color:#94a3b8;
  -webkit-tap-highlight-color:transparent;
  transition:color .12s;
}
.tt-tab-item.active{color:#2563eb;}
.tt-tab-icon{display:flex;align-items:center;justify-content:center;height:24px;}
.tt-tab-icon svg{display:block;}
.tt-tab-label{font-size:10px;font-weight:700;letter-spacing:-.01em;}
.tt-tab-badge{
  position:absolute;top:0;right:calc(50% - 22px);
  min-width:16px;height:16px;padding:0 4px;
  background:#2563eb;color:#fff;border-radius:999px;
  font-size:10px;font-weight:800;
  display:flex;align-items:center;justify-content:center;
}
.tt-tab-badge.cart{background:#ef4444;}

/* 모바일에서만 하단 탭바 표시 */
@media (max-width:768px){
  .tt-app-tabbar{display:flex;}
  body{padding-bottom:64px;} /* 탭바 높이만큼 여백 */
  .tt-footer{margin-bottom:0;}
}
/* iPhone 노치 환경 (safe-area 큰 경우) */
@media (max-width:768px) and (display-mode:standalone){
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom, 0px));}
}
/* PC에서는 표시 안 함 */
@media (min-width:769px){
  .tt-app-tabbar{display:none!important;}
}

/* ===== 앱(standalone) 모드 전용 최적화 ===== */
body.pwa-standalone .tt-utilbar{display:none;} /* 앱에서는 상단 유틸바 숨김 — 앱 화면 더 넓게 */
body.pwa-standalone .tt-header{top:0;}

/* ===== 모바일 앱 감성 개선 ===== */
@media (max-width:768px){
  /* 하단 고정 구매바가 탭바와 겹치지 않게 */
  .pdh-action-row{
    bottom:64px;
    box-shadow:0 -2px 12px rgba(0,0,0,.06);
  }
  /* 터치 타깃 최소 44px */
  .tt-nav a,.tt-header-actions a{padding:10px 12px;}
  .prod-card:active{transform:scale(.985);}
  .tt-app-tabbar .tt-tab-item:active{opacity:.6;}
  /* 모달들이 탭바 위에 위치 */
  .review-modal-overlay,.resv-modal-overlay{z-index:9600;}
  /* 인풋 확대 방지 (iOS는 16px 이상이어야 포커스 시 확대 안 됨) */
  input[type=text],input[type=tel],input[type=email],input[type=number],
  input[type=password],input[type=date],input[type=search],select,textarea{font-size:16px;}
}

/* ================================================================
   [v18] 모바일 상단 잘림 + 헤더 가운데 정렬 + 하단바 고정 보강
   ================================================================ */

/* 1) 상단 안전영역(노치) — 유틸바가 노치까지 덮어서 상단이 잘리지 않게 */
.tt-utilbar{padding-top:env(safe-area-inset-top, 0px);}
/* PWA 앱 모드(유틸바 숨김)에서는 헤더 자체가 노치만큼 내려옴 */
body.pwa-standalone .tt-header{padding-top:env(safe-area-inset-top, 0px);}
/* 웹브라우저 모드에서도 스크롤 시 헤더가 노치에 가려지지 않게 */
@supports (padding: env(safe-area-inset-top, 0px)){
  .tt-header{top:0;}
}

/* 2) 하단 탭바 고정 보강 — 어떤 상황에서도 화면 하단에 고정 */
.tt-app-tabbar{
  position:fixed;bottom:0;left:0;right:0;
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
  will-change:transform;
}

/* 3) 모바일 헤더 3분할 그리드 — [☰] [로고(가운데)] [액션] */
@media (max-width:768px){
  .tt-header-inner{
    display:grid;
    grid-template-columns:40px 1fr auto;
    align-items:center;
    gap:8px;
    padding:8px 10px;
    min-height:54px;
    height:auto;
    flex-wrap:nowrap;
  }
  .tt-mobile-menu-btn{grid-column:1;grid-row:1;justify-self:start;width:40px;height:40px;}
  .tt-logo{grid-column:2;grid-row:1;justify-self:center;max-width:100%;overflow:hidden;}
  .tt-logo-img{height:34px;max-height:38px;}
  .tt-header-actions{grid-column:3;grid-row:1;justify-self:end;gap:4px;font-size:12px;flex-wrap:nowrap;}
  .tt-header-actions a{padding:6px 7px;font-size:12px;white-space:nowrap;}
  .tt-user-type-badge{display:none;} /* 모바일 헤더에서 배지 생략 — 가운데 정렬 깔끔하게 */
  .tt-header-search{
    grid-column:1 / -1;grid-row:2;
    order:0;flex-basis:auto;max-width:100%;width:100%;margin:4px 0 0;
  }
  .tt-search-input{font-size:14px;}

  /* 본문이 탭바에 가려지지 않게 (노치 단말 safe-area 포함) */
  body{padding-bottom:calc(60px + env(safe-area-inset-bottom, 0px));}
  /* 상품 상세 하단 구매바는 탭바 위에 정확히 위치 */
  .pdh-action-row{bottom:calc(60px + env(safe-area-inset-bottom, 0px));}
}
/* 아주 좁은 화면(320px) — 액션 링크 축소 */
@media (max-width:360px){
  .tt-header-actions a{padding:6px 4px;font-size:11px;}
  .tt-logo-img{height:30px;}
}


/* ================================================================
   [v22] AI 챗봇 플로팅 위젯 — FAB/패널 독립 fixed 배치 (전면 재설계)
   ================================================================ */

/* ── 플로팅 버튼 (FAB) ── */
.cbt-fab{
  position:fixed;right:20px;bottom:20px;z-index:9401;
  width:56px;height:56px;border:none;border-radius:50%;
  background:linear-gradient(135deg,#2563eb,#1d4ed8);
  color:#fff;font-size:24px;cursor:pointer;
  box-shadow:0 8px 24px rgba(37,99,235,.45);
  display:flex;align-items:center;justify-content:center;
  transition:transform .18s,box-shadow .18s,background .18s;
  -webkit-tap-highlight-color:transparent;
}
.cbt-fab:hover{transform:scale(1.07);}
.kakao-fab{position:fixed;right:20px;bottom:88px;z-index:9401;width:56px;height:56px;border-radius:50%;background:#fee500;color:#191919;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;text-decoration:none;box-shadow:0 5px 18px #0002;transition:transform .18s;}
.kakao-fab small{font-size:9px;font-weight:800;line-height:1;}
.kakao-fab:hover{transform:scale(1.06);color:#191919;}
.kakao-fab:focus-visible{outline:3px solid #1d4ed8;outline-offset:3px;}
@media(max-width:768px){.kakao-fab{right:14px;bottom:calc(134px + env(safe-area-inset-bottom,0px));width:50px;height:50px;}.kakao-fab.cbt-hidden{display:none;}body.cbt-buybar-page .kakao-fab{bottom:calc(196px + env(safe-area-inset-bottom,0px));}}
.cbt-fab:active{transform:scale(.96);}
.cbt-fab.active{background:#0f172a;box-shadow:0 8px 24px rgba(15,23,42,.35);}
.cbt-fab-icon{line-height:1;}
.cbt-fab-badge{
  position:absolute;top:-2px;right:-2px;
  background:#f59e0b;color:#fff;font-size:9px;font-weight:900;
  padding:2px 6px;border-radius:999px;border:2px solid #fff;letter-spacing:.5px;
}

/* ── 챗 패널 (독립 fixed — 데스크톱: 우측 하단 카드) ── */
.cbt-panel{
  position:fixed;right:20px;bottom:88px;z-index:9402;
  width:350px;max-width:calc(100vw - 40px);
  height:480px;max-height:calc(100vh - 130px);
  background:#fff;border-radius:18px;border:1px solid #e2e8f0;
  box-shadow:0 24px 60px rgba(15,23,42,.24);
  display:flex;flex-direction:column;overflow:hidden;
  opacity:0;visibility:hidden;transform:translateY(16px) scale(.98);
  transform-origin:bottom right;
  transition:opacity .22s ease,transform .22s ease,visibility .22s;
}
.cbt-panel.open{opacity:1;visibility:visible;transform:translateY(0) scale(1);}

/* 헤더 */
.cbt-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px;flex-shrink:0;
  background:linear-gradient(135deg,#0f172a,#1e293b);color:#fff;
}
.cbt-head-profile{display:flex;align-items:center;gap:10px;min-width:0;}
.cbt-head-avatar{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,#2563eb,#60a5fa);
  display:flex;align-items:center;justify-content:center;font-size:19px;
}
.cbt-head-info{display:flex;flex-direction:column;gap:2px;min-width:0;}
.cbt-head-info strong{font-size:14px;font-weight:800;line-height:1.2;white-space:nowrap;}
.cbt-head-status{display:flex;align-items:center;gap:5px;font-size:10px;color:#94a3b8;font-weight:600;}
.cbt-head-status i{width:6px;height:6px;border-radius:50%;background:#22c55e;display:inline-block;}
.cbt-head-close{background:none;border:none;color:#94a3b8;font-size:24px;cursor:pointer;line-height:1;padding:2px 4px;flex-shrink:0;}
.cbt-head-close:hover{color:#fff;}

/* 대화 영역 */
.cbt-body{
  flex:1;overflow-y:auto;overflow-x:hidden;padding:16px 14px;
  background:#f8fafc;
  display:flex;flex-direction:column;gap:10px;
}
.cbt-body::-webkit-scrollbar{width:5px;}
.cbt-body::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px;}
.cbt-msg{display:flex;max-width:86%;}
.cbt-msg.user{align-self:flex-end;}
.cbt-msg.bot{align-self:flex-start;}
.cbt-msg.bot .cbt-bubble{border-top-left-radius:4px;}
.cbt-msg.user .cbt-bubble{border-top-right-radius:4px;}
.cbt-bubble{
  padding:11px 14px;border-radius:16px;font-size:13px;line-height:1.7;
  white-space:pre-wrap;word-break:break-word;
}
.cbt-msg.bot .cbt-bubble{background:#fff;border:1px solid #e2e8f0;color:#1e293b;box-shadow:0 1px 2px rgba(0,0,0,.04);}
.cbt-msg.user .cbt-bubble{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;box-shadow:0 4px 12px rgba(37,99,235,.3);}

/* 입력 중 표시 */
.cbt-typing .cbt-bubble{display:flex;gap:5px;align-items:center;padding:13px 16px;}
.cbt-dot{width:7px;height:7px;border-radius:50%;background:#94a3b8;animation:cbtBlink 1.2s infinite;}
.cbt-dot:nth-child(2){animation-delay:.2s;}
.cbt-dot:nth-child(3){animation-delay:.4s;}
@keyframes cbtBlink{0%,80%,100%{opacity:.25;transform:translateY(0);}40%{opacity:1;transform:translateY(-2px);}}

/* 추천 질문 칩 */
.cbt-suggest-row{display:flex;flex-wrap:wrap;gap:6px;padding:2px 0;}
.cbt-suggest-chip{
  background:#fff;border:1px solid #bfdbfe;color:#1d4ed8;
  font-size:11.5px;font-weight:700;padding:7px 13px;border-radius:999px;
  cursor:pointer;transition:background .12s,transform .12s,box-shadow .12s;
  box-shadow:0 1px 3px rgba(37,99,235,.1);
}
.cbt-suggest-chip:hover{background:#eff6ff;transform:translateY(-1px);box-shadow:0 3px 8px rgba(37,99,235,.15);}
.cbt-suggest-chip:active{transform:scale(.97);}

/* 입력창 */
.cbt-input-row{
  display:flex;gap:8px;padding:11px 12px;background:#fff;
  border-top:1px solid #e2e8f0;flex-shrink:0;
}
.cbt-input-row input{
  flex:1;min-width:0;border:1.5px solid #e2e8f0;border-radius:12px;
  padding:11px 13px;font-size:13px;outline:none;transition:border-color .15s,box-shadow .15s;
}
.cbt-input-row input:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.1);}
.cbt-input-row button{
  flex-shrink:0;width:44px;height:44px;border:none;border-radius:12px;
  background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:transform .12s,filter .12s;
  box-shadow:0 4px 10px rgba(37,99,235,.3);
}
.cbt-input-row button:hover{filter:brightness(1.08);}
.cbt-input-row button:active{transform:scale(.94);}
.cbt-foot-note{font-size:10px;color:#94a3b8;text-align:center;padding:0 10px 9px;background:#fff;flex-shrink:0;}

/* ── 모바일: 패널은 앱식 바텀시트, FAB은 탭바 위 ── */
@media (max-width:768px){
  .cbt-fab{
    right:14px;bottom:calc(72px + env(safe-area-inset-bottom, 0px));
    width:50px;height:50px;font-size:21px;
  }
  /* 패널 열리면 FAB 숨김 (바텀시트가 덮음) */
  .cbt-fab.cbt-hidden{display:none;}
  .cbt-panel{
    right:0;left:0;bottom:0;width:100%;max-width:100%;
    height:min(78vh, 560px);max-height:min(78vh, 560px);
    border-radius:20px 20px 0 0;border:none;
    z-index:9600;
    transform:translateY(100%);
    transform-origin:bottom center;
    transition:transform .28s cubic-bezier(.32,.72,.28,1),opacity .2s,visibility .2s;
    opacity:1;visibility:hidden;
    box-shadow:0 -12px 40px rgba(15,23,42,.25);
  }
  .cbt-panel.open{transform:translateY(0);visibility:visible;}
  /* 바텀시트 그립 핸들 */
  .cbt-panel::before{
    content:'';position:absolute;top:8px;left:50%;transform:translateX(-50%);
    width:40px;height:4px;border-radius:999px;background:#cbd5e1;z-index:1;
  }
  .cbt-head{padding-top:18px;}
  /* 본문이 탭바에 안 가리도록 */
  .cbt-foot-note{padding-bottom:calc(9px + env(safe-area-inset-bottom, 0px));}
}
/* 상품 상세(모바일) — 하단 구매바가 있으면 FAB을 그 위로 (JS가 body 클래스 부여) */
@media (max-width:768px){
  body.cbt-buybar-page .cbt-fab{bottom:calc(134px + env(safe-area-inset-bottom, 0px));}
}
/* PC에서도 상품 상세 구매바와 겹침 없음 — FAB은 기본 위치면 충분 */
.biz-year-stock{display:grid;gap:7px;margin:12px 0;padding:12px;border:1px solid #dbe6e2;border-radius:10px;background:#f7fbf9;color:#263d35;text-align:left;font-size:14px}
.biz-year-stock-row{display:flex;align-items:center;justify-content:space-between;gap:12px;line-height:1.5}
.biz-year-stock-row span{font-weight:650}.biz-year-stock-row strong{color:#08734e;font-size:16px;font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}

/* Visible search icon and a 44px touch target on desktop and mobile. */
.tt-header-search .tt-search-btn{width:44px;height:44px;padding:10px;border-radius:10px;flex-shrink:0}
.tt-header-search .tt-search-btn svg{display:block;width:24px;height:24px;flex:none}
.tt-header-search .tt-search-btn:focus-visible{outline:3px solid #60a5fa;outline-offset:2px}