/* JapanWheels Stock Cars & Vehicle Detail — Phase 6
   Emerald Motors palette: navy #0b1d2d, green #1f9d5c */

:root{
	--jw-navy:#0b1d2d;--jw-green:#1f9d5c;--jw-green-dark:#157a46;
	--jw-green-light:#e6f6ec;--jw-white:#fff;
	--jw-border:#e3e8ec;--jw-muted:#5b6b78;--jw-bg:#f6f9f8;
	--jw-radius:10px;--jw-shadow:0 4px 16px rgba(11,29,45,.08);
	--jw-shadow-lg:0 12px 32px rgba(11,29,45,.14);
}

/* ---------------------------------------------------------------
   Filter bar
--------------------------------------------------------------- */
.jw-stock-filter-bar{background:var(--jw-white);border:1px solid var(--jw-border);border-radius:14px;box-shadow:var(--jw-shadow-lg);padding:20px 24px;margin-bottom:28px}
.jw-stock-filter-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.jw-stock-filter-row--secondary{margin-top:12px;padding-top:12px;border-top:1px solid var(--jw-border)}
.jw-filter{display:flex;flex-direction:column;gap:5px;min-width:130px;flex:1}
.jw-filter--grow{flex:2 1 200px}
.jw-filter label{font-size:12px;font-weight:700;color:var(--jw-muted);text-transform:uppercase;letter-spacing:.04em}
.jw-filter input,.jw-filter select{min-height:42px;padding:8px 12px;border:1px solid var(--jw-border);border-radius:8px;font-size:.9rem;background:var(--jw-white);color:var(--jw-navy);width:100%}
.jw-filter input:focus,.jw-filter select:focus{outline:2px solid var(--jw-green);border-color:var(--jw-green)}
.jw-filter-year .jw-year-range{display:flex;align-items:center;gap:6px}
.jw-filter-year .jw-year-range input{flex:1}
.jw-filter-actions{display:flex;align-items:center;gap:10px;padding-bottom:2px}
.jw-reset{color:var(--jw-muted);font-size:.85rem;text-decoration:underline;white-space:nowrap}

/* Buttons */
.jw-button,.button.jw-button{display:inline-flex;align-items:center;justify-content:center;gap:.35em;min-height:42px;padding:9px 20px;background:var(--jw-green);color:var(--jw-white)!important;border:2px solid var(--jw-green);border-radius:8px;font-weight:700;font-size:.9rem;text-decoration:none;cursor:pointer;transition:background .15s,transform .1s}
.jw-button:hover{background:var(--jw-green-dark);border-color:var(--jw-green-dark);transform:translateY(-1px)}
.jw-button-outline{background:var(--jw-white);color:var(--jw-navy)!important;border-color:var(--jw-border)}
.jw-button-outline:hover{border-color:var(--jw-green);color:var(--jw-green)!important}
.jw-button-whatsapp{background:#25d366;border-color:#25d366}
.jw-button-whatsapp:hover{background:#128c7e;border-color:#128c7e}

/* ---------------------------------------------------------------
   Toolbar
--------------------------------------------------------------- */
.jw-stock-toolbar{display:flex;align-items:center;gap:12px;margin:0 0 16px;color:var(--jw-muted);font-size:.9rem}
.jw-stock-toolbar strong{color:var(--jw-navy)}
.jw-stock-loading{color:var(--jw-green);font-style:italic}

/* ---------------------------------------------------------------
   Vehicle grid + cards
--------------------------------------------------------------- */
.jw-vehicle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.jw-vehicle-card{background:var(--jw-white);border:1px solid var(--jw-border);border-radius:var(--jw-radius);overflow:hidden;box-shadow:var(--jw-shadow);transition:box-shadow .18s,transform .18s;display:flex;flex-direction:column}
.jw-vehicle-card:hover{box-shadow:var(--jw-shadow-lg);transform:translateY(-3px)}
.jw-card-image{display:block;position:relative;aspect-ratio:4/3;background:var(--jw-bg);overflow:hidden;flex-shrink:0}
.jw-card-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .28s ease}
.jw-vehicle-card:hover .jw-card-image img{transform:scale(1.04)}
.jw-card-badges{position:absolute;top:10px;left:10px;display:flex;flex-wrap:wrap;gap:4px;z-index:2}
.jw-badge{display:inline-block;padding:3px 8px;border-radius:6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;background:var(--jw-green);color:var(--jw-white)}
.jw-badge--new{background:#0284c7}
.jw-badge--low_mileage{background:#7c3aed}
.jw-badge--auction_sheet{background:#ea580c}
.jw-badge--featured{background:#d97706}
.jw-no-image{display:flex;align-items:center;justify-content:center;height:100%;color:var(--jw-muted);font-size:.85rem}
.jw-card-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.jw-card-title-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.jw-card-title-row h3{margin:0;font-size:1.05rem;line-height:1.3}
.jw-card-title-row h3 a{color:var(--jw-navy);text-decoration:none}
.jw-year{background:var(--jw-green-light);color:var(--jw-green-dark);font-size:.75rem;font-weight:700;padding:.2em .6em;border-radius:5px;white-space:nowrap}
.jw-specs{display:flex;flex-wrap:wrap;gap:4px 10px;color:var(--jw-muted);font-size:.82rem}
.jw-specs span{position:relative;padding-right:10px}
.jw-specs span:not(:last-child)::after{content:"·";position:absolute;right:0;color:var(--jw-border)}
.jw-price{color:var(--jw-green-dark);font-weight:800;font-size:1.2rem;margin:2px 0}
.jw-card-actions{display:flex;gap:8px;align-items:center;margin-top:auto;padding-top:4px}
.jw-card-actions .jw-button{flex:1;font-size:.83rem;min-height:38px;padding:7px 12px}
.jw-btn-save{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--jw-border);border-radius:8px;background:var(--jw-white);color:var(--jw-muted);cursor:pointer;transition:color .15s,border-color .15s;flex-shrink:0;padding:0}
.jw-btn-save:hover,.jw-btn-save.is-saved{color:var(--jw-green);border-color:var(--jw-green)}

/* ---------------------------------------------------------------
   Pagination
--------------------------------------------------------------- */
.jw-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:32px}
.jw-pagination a{display:grid;place-items:center;min-width:38px;height:38px;border:1px solid var(--jw-border);border-radius:7px;text-decoration:none;color:var(--jw-navy);font-size:.9rem;cursor:pointer}
.jw-pagination a:hover{border-color:var(--jw-green);color:var(--jw-green)}
.jw-pagination a.is-current{background:var(--jw-green);color:var(--jw-white);border-color:var(--jw-green)}

.jw-empty,.jw-notice{padding:32px;text-align:center;border:1px solid var(--jw-border);border-radius:var(--jw-radius);background:var(--jw-white)}

/* ---------------------------------------------------------------
   Vehicle detail
--------------------------------------------------------------- */
.jw-breadcrumb{font-size:.85rem;color:var(--jw-muted);margin-bottom:20px;display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.jw-breadcrumb a{color:var(--jw-green);text-decoration:none}
.jw-breadcrumb a:hover{text-decoration:underline}
.jw-detail-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:start}

/* Gallery */
.jw-gallery-main{position:relative;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:var(--jw-bg);margin-bottom:10px}
.jw-gallery-main img{width:100%;height:100%;object-fit:contain;display:block;cursor:zoom-in}
.jw-gallery-zoom{position:absolute;top:12px;right:12px;background:rgba(0,0,0,.55);color:#fff;border:0;border-radius:7px;padding:7px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.jw-gallery-arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.45);color:#fff;border:0;width:38px;height:48px;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
.jw-gallery-prev{left:0;border-radius:0 8px 8px 0}
.jw-gallery-next{right:0;border-radius:8px 0 0 8px}
.jw-gallery-thumbs{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px}
.jw-thumb{flex:0 0 80px;height:60px;border:2px solid transparent;border-radius:7px;overflow:hidden;padding:0;background:none;cursor:pointer}
.jw-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.jw-thumb.is-active,.jw-thumb:hover{border-color:var(--jw-green)}

/* Detail panel */
.jw-detail-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.jw-eyebrow{font-size:.8rem;text-transform:uppercase;letter-spacing:.07em;color:var(--jw-muted);margin:0 0 4px}
.jw-detail-content h1{font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.15;color:var(--jw-navy);margin:0 0 6px}
.jw-detail-price{font-size:1.8rem;font-weight:800;color:var(--jw-green-dark);margin:0 0 20px;line-height:1}
.jw-price-note{font-size:.75rem;font-weight:400;color:var(--jw-muted);display:block;margin-top:3px}

/* Specs table */
.jw-detail-specs{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--jw-border);border-radius:var(--jw-radius);overflow:hidden;margin:0 0 20px}
.jw-spec-row{padding:11px 14px;border-bottom:1px solid var(--jw-border)}
.jw-spec-row:nth-child(odd){border-right:1px solid var(--jw-border)}
.jw-spec-row:nth-last-child(1),.jw-spec-row:nth-last-child(2){border-bottom:none}
.jw-spec-row dt{font-size:.73rem;color:var(--jw-muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}
.jw-spec-row dd{margin:0;font-weight:600;color:var(--jw-navy);font-size:.9rem}

.jw-detail-description{margin:16px 0;padding:16px;background:var(--jw-bg);border-radius:var(--jw-radius);font-size:.9rem;line-height:1.65}
.jw-detail-description h3{margin:0 0 8px;font-size:1rem}
.jw-detail-ctas{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.jw-detail-share{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--jw-muted);margin-top:12px}
.jw-share-copy{background:none;border:1px solid var(--jw-border);border-radius:6px;padding:4px 10px;cursor:pointer;font-size:.82rem;color:var(--jw-navy)}
.jw-share-copy:hover{border-color:var(--jw-green);color:var(--jw-green)}

/* ---------------------------------------------------------------
   Lightbox
--------------------------------------------------------------- */
.jw-lightbox-overlay{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:9998}
.jw-lightbox{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.jw-lightbox-img{max-width:92vw;max-height:90vh;object-fit:contain;border-radius:8px}
.jw-lightbox-close{position:absolute;top:16px;right:20px;background:none;border:0;color:#fff;font-size:2rem;cursor:pointer;z-index:10000}
.jw-lightbox-arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.15);border:0;color:#fff;font-size:2.5rem;width:52px;height:72px;cursor:pointer;border-radius:8px}
.jw-lightbox-prev{left:12px}
.jw-lightbox-next{right:12px}
.jw-lightbox-counter{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);color:#fff;font-size:.9rem;background:rgba(0,0,0,.55);padding:4px 12px;border-radius:999px}

/* ---------------------------------------------------------------
   Related vehicles
--------------------------------------------------------------- */
.jw-related-section{margin-top:52px;padding-top:32px;border-top:1px solid var(--jw-border)}
.jw-related-section h2{font-size:1.35rem;color:var(--jw-navy);margin:0 0 20px}
.jw-related-section .jw-vehicle-grid{grid-template-columns:repeat(4,minmax(0,1fr))}

/* ---------------------------------------------------------------
   Responsive
--------------------------------------------------------------- */
@media(max-width:1100px){
	.jw-vehicle-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.jw-related-section .jw-vehicle-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.jw-detail-grid{grid-template-columns:1fr;gap:28px}
}
@media(max-width:640px){
	.jw-vehicle-grid{grid-template-columns:1fr}
	.jw-stock-filter-row{flex-direction:column}
	.jw-filter{min-width:0;width:100%}
	.jw-detail-specs{grid-template-columns:1fr}
	.jw-spec-row:nth-child(odd){border-right:none}
	.jw-spec-row:nth-last-child(2){border-bottom:1px solid var(--jw-border)}
	.jw-lightbox-arrow{display:none}
}