/* JD Shop's card hierarchy, adapted to GOKO's green palette and existing layout. */
.goko-catalogue, .goko-card, .goko-detail { font-family: 'Segoe UI', Arial, sans-serif; color: #19332a; }
.goko-card { min-width: 0; padding: 13px; display: flex; flex-direction: column; background: #fff; border: 1px solid #e0e8e3; border-radius: 16px; box-shadow: 0 8px 24px #173b2810; transition: box-shadow .2s, transform .2s; }
.goko-card:hover { transform: translateY(-3px); box-shadow: 0 16px 32px #173b2819; }
.goko-card-media { position: relative; margin: 0 0 18px; }
.goko-card-media > a { display: block; overflow: hidden; border-radius: 11px; }
.goko-card-media img { display: block; width: 100%; height: auto; aspect-ratio: 1.25; object-fit: contain; background: #f7f9f7; }
.goko-card-media--empty { min-height: 40px; }
.goko-stock-pill { position: absolute; left: 9px; top: 10px; padding: 5px 10px; background: #dcf5e4; color: #166534; border: 1px solid #c6e8ce; border-radius: 30px; font-size: 10px; font-weight: 700; line-height: 1.3; }
.goko-stock-pill--request { background: #fff5d6; color: #7c5b13; border-color: #f0dfae; }
.goko-stock-pill--unavailable { background: #fee7e5; color: #ad3225; border-color: #f4ccc7; }
.goko-save { position: absolute; top: 9px; right: 9px; width: 38px; height: 38px; border-radius: 50%; background: #fffffff2; border: 1px solid #dce6df; color: #345647; display: grid; place-items: center; box-shadow: 0 3px 10px #173b2812; cursor: pointer; }
.goko-save[aria-pressed="true"] { color: #b5374e; background: #fff0f3; }
.goko-card-body { padding: 0 5px 7px; display: flex; flex-direction: column; flex: 1; }
.goko-card-category { color: #548567; font-size: 10px; letter-spacing: .7px; font-weight: 700; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.goko-card h3 { margin: 12px 0 10px; font: 700 17px/1.4 'Segoe UI', Arial, sans-serif; }
.goko-card h3 a { color: #19332a; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.goko-rating { display: flex; gap: 10px; align-items: center; margin: 0 0 12px; color: #6d8277; font-size: 11px; }
.goko-stars { position: relative; display: inline-block; width: 90px; overflow: hidden; height: 21px; white-space: nowrap; font: 18px/21px Arial, sans-serif; letter-spacing: 1px; }
.goko-stars::before, .goko-stars > span::before { content: '\2605\2605\2605\2605\2605'; }
.goko-stars::before { color: #dce5df; }
.goko-stars > span { position: absolute; left: 0; top: 0; height: 100%; overflow: hidden; color: #e4a22e; }
.goko-card-price { display: flex; flex-direction: column; align-items: flex-start; margin-top: auto; }
.goko-card-price del { color: #8a9a91; font-size: 12px; }
.goko-card-price strong { color: #217340; font-size: 23px; font-weight: 800; line-height: 1.2; }
.goko-card-price small { color: #718378; margin-top: 4px; }
.goko-availability { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 8px; padding: 13px 0; margin-bottom: 12px; border-bottom: 1px solid #e6ece8; font-size: 11px; }
.goko-availability > span { display: inline-flex; gap: 6px; align-items: center; color: #238149; font-weight: 700; }
.goko-availability i { width: 7px; height: 7px; background: currentColor; border-radius: 50%; }
.goko-availability small { color: #7a8a81; font-size: 10px; }
.goko-availability--request > span { color: #92701c; }
.goko-availability--unavailable > span { color: #ba4135; }
.goko-card-actions { display: grid; gap: 9px; }
.goko-button { min-height: 43px; padding: 10px 16px; display: inline-flex; justify-content: center; align-items: center; gap: 10px; border: 1px solid transparent; border-radius: 7px; font: 700 12px/1.4 'Segoe UI', Arial, sans-serif; text-align: center; cursor: pointer; }
.goko-button--primary { color: #fff; background: #287a3e; border-color: #287a3e; }
.goko-button--primary:hover { color: #fff; background: #1d602f; }
.goko-button--outline { color: #28543b; background: #fff; border-color: #cddfd2; }
.goko-button--outline:hover { color: #1c542e; background: #f1f8f3; }
.goko-button:disabled { opacity: .6; cursor: wait; }
.goko-card a:focus-visible, .goko-button:focus-visible, .goko-save:focus-visible { outline: 3px solid #84b892; outline-offset: 3px; }
.goko-catalogue { background: #f5f8f5; padding: 48px 0 72px; }
.goko-shop-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.goko-shop-heading h1 { font: 750 clamp(28px,4vw,42px)/1.2 'Segoe UI',Arial,sans-serif; margin: 8px 0 12px; }
.goko-shop-heading p { color: #718378; margin: 0; }
.goko-kicker { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 1.5px; color: #4e855e; }
.goko-shop-layout { display: grid; grid-template-columns: 235px minmax(0,1fr); gap: 30px; }
.goko-shop-filters { border: 1px solid #e0e8e3; border-radius: 14px; padding: 22px; background: #fff; align-self: start; }
.goko-shop-filters label { display: block; font-size: 12px; font-weight: 700; margin: 0 0 7px; }
.goko-shop-filters input, .goko-shop-filters select { width: 100%; border: 1px solid #dce5df; border-radius: 7px; padding: 10px; background: #fff; color: #264737; margin-bottom: 20px; font-size: 13px; }
.goko-shop-filters .goko-button { width: 100%; margin-bottom: 12px; }
.goko-type-tabs { display: flex; gap: 8px; flex-wrap: wrap; padding: 10px; background: #fff; border: 1px solid #e0e8e3; border-radius: 12px; margin-bottom: 22px; }
.goko-type-tabs a { padding: 9px 18px; color: #698174; font-weight: 650; font-size: 13px; border-radius: 7px; }
.goko-type-tabs a[aria-current="page"] { color: #fff; background: #287a3e; }
.goko-catalogue-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.goko-result-count { font-size: 12px; color: #63776b; margin: 0 0 16px; }
.goko-pagination { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 28px; }
.goko-pagination a { padding: 8px 14px; background: #fff; border: 1px solid #dce5df; border-radius: 6px; color: #28543b; }
.goko-pagination a[aria-current] { background: #287a3e; color: #fff; }
.goko-empty { padding: 40px; border: 1px solid #dce5df; border-radius: 14px; background: #fff; text-align: center; }
.goko-detail { padding: 38px 0 72px; background: #f8faf7; }
.goko-breadcrumb { display: flex; flex-wrap: wrap; gap: 10px; color: #75867b; font-size: 12px; margin-bottom: 28px; }
.goko-detail-main { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 52px; }
.goko-detail-photo { display: block; width: 100%; max-height: 560px; object-fit: contain; background: #fff; border: 1px solid #e0e8e3; border-radius: 16px; }
.goko-gallery-thumbs { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.goko-gallery-thumbs button { padding: 3px; background: #fff; border: 1px solid #dce5df; border-radius: 8px; }
.goko-gallery-thumbs button[aria-pressed="true"] { border: 2px solid #287a3e; padding: 2px; }
.goko-gallery-thumbs img { width: 76px; height: 76px; object-fit: contain; border-radius: 5px; }
.goko-detail h1 { margin: 10px 0 18px; font: 750 clamp(26px,3vw,38px)/1.25 'Segoe UI',Arial,sans-serif; }
.goko-detail .goko-card-price strong { font-size: 34px; }
.goko-detail-summary { color: #5e7265; line-height: 1.8; margin: 22px 0; white-space: pre-line; }
.goko-detail-actions { display: flex; gap: 12px; flex-wrap: wrap; margin: 24px 0; }
.goko-detail-actions > .goko-button { flex: 1; min-width: 160px; }
.goko-detail-actions .goko-save { position: static; flex-shrink: 0; border-radius: 8px; width: 44px; height: 44px; }
.goko-detail-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 24px 0; font-size: 13px; }
.goko-detail-facts dt { color: #788a7c; font-size: 11px; font-weight: 500; margin-bottom: 4px; }
.goko-detail-facts dd { margin: 0; font-weight: 650; }
.goko-detail-section { scroll-margin-top: 115px; background: #fff; border: 1px solid #e0e8e3; border-radius: 14px; padding: 30px; margin-top: 28px; }
.goko-detail-section h2 { font: 750 23px/1.3 'Segoe UI',Arial,sans-serif; margin: 0 0 20px; }
.goko-detail-copy { white-space: pre-line; color: #536b5c; line-height: 1.9; }
.goko-detail-nav { display: flex; gap: 20px; flex-wrap: wrap; padding: 22px 0 0; margin-top: 35px; font-weight: 650; font-size: 13px; }
.goko-review { border-bottom: 1px solid #e6ece8; padding: 18px 0; }
.goko-review p { white-space: pre-line; margin-top: 8px; }
.goko-review-form { margin-top: 25px; display: grid; gap: 14px; max-width: 620px; }
.goko-review-form label { font-size: 13px; font-weight: 650; }
.goko-review-form select, .goko-review-form textarea { display: block; width: 100%; border: 1px solid #dce5df; border-radius: 8px; padding: 12px; margin-top: 7px; }
.goko-feedback { color: #28543b; font-size: 13px; font-weight: 650; }
@media (max-width:1199px) { .goko-shop-layout { grid-template-columns: 210px minmax(0,1fr); gap: 20px; } .goko-catalogue-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:767px) { .goko-shop-layout, .goko-detail-main { grid-template-columns: minmax(0,1fr); } .goko-detail-main { gap: 26px; } .goko-shop-heading { align-items: flex-start; flex-direction: column; } .goko-shop-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 0 15px; } .goko-detail-section { padding: 22px; } }
@media (max-width:480px) { .goko-catalogue-grid { grid-template-columns: minmax(0,1fr); } .goko-card h3 a { white-space: normal; } .goko-shop-filters { grid-template-columns: minmax(0,1fr); } .goko-type-tabs a { padding: 9px 12px; } }
@media (prefers-reduced-motion:reduce) { .goko-card { transition: none; } }
