@import url('/shared/component-styles/merchant-directory/default.css');

/* Websälän jälleenmyyjähakemisto ja tarjouskortit. */
.merchant-directory{--merchant-ink:#172b46;--merchant-green:#226b59;--merchant-line:#dce5e8;max-width:1200px;color:var(--merchant-ink)}
.merchant-directory__header{position:relative;overflow:hidden;margin:0 0 2.5rem;padding:clamp(1.5rem,4vw,3.5rem);border:1px solid var(--merchant-line);border-radius:24px;background:linear-gradient(120deg,#eef5f3 0%,#f4f7fa 72%)}
.merchant-directory__header::before{content:'TARJOUKSET JA ALEKOODIT';display:block;margin-bottom:1rem;color:var(--merchant-green);font-size:.75rem;font-weight:800;letter-spacing:.14em}
.merchant-directory__header h1{max-width:850px;margin:0;font-size:clamp(2rem,4.2vw,3.4rem);line-height:1.12;letter-spacing:-.04em;color:var(--merchant-ink)}
.merchant-directory__header p{max-width:680px;margin:1.25rem 0 0;color:#526579;font-size:1.08rem;line-height:1.7}
.merchant-directory__header img{float:right;width:140px;height:84px;margin:0 0 1rem 2rem;padding:1rem;background:white;border:1px solid var(--merchant-line);border-radius:14px;object-fit:contain}
.merchant-directory>nav{margin-bottom:1.5rem;font-size:.88rem;color:#526579}.merchant-directory>nav a{color:var(--merchant-green);text-underline-offset:3px}
.merchant-directory:has(>section){display:flex;flex-direction:column;gap:2.5rem}
.merchant-directory:has(>section)>.merchant-directory__header{order:0;margin-bottom:0}
.merchant-directory>section{order:1}
.merchant-directory:has(>section)>.merchant-directory__layout{order:2;padding-top:2.5rem;border-top:1px solid var(--merchant-line)}
.merchant-directory h2{margin:0 0 1rem;font-size:clamp(1.45rem,2.5vw,2rem);letter-spacing:-.025em;line-height:1.25}
.merchant-directory>section>label{display:block;max-width:520px;margin:1.5rem 0 2rem;font-size:.9rem;font-weight:700}
.merchant-directory input[type=search]{display:block;width:100%;box-sizing:border-box;margin-top:.6rem;padding:1rem 1.15rem;border:1px solid #c7d5dc;border-radius:12px;background:#fff;color:var(--merchant-ink);font:inherit;font-weight:400;box-shadow:0 3px 12px #172b4605}
.merchant-directory input::placeholder{color:#738293}
.merchant-directory__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin:0}
.merchant-directory__card{position:relative;display:flex;flex-direction:column;align-items:flex-start;min-height:178px;padding:1.5rem;background:#fff;border:1px solid var(--merchant-line);border-radius:16px;box-shadow:0 4px 18px #172b4605;transition:transform .18s,border-color .18s,box-shadow .18s}
.merchant-directory__card img{width:128px;height:64px;margin-bottom:1.25rem;object-fit:contain;object-position:left center}
.merchant-directory__card h3{margin:auto 1.5rem .65rem 0;font-size:1.06rem;line-height:1.4}
.merchant-directory__card h3 a{color:var(--merchant-ink);text-decoration:none}
.merchant-directory__card h3 a::after{content:'';position:absolute;inset:0;border-radius:16px}
.merchant-directory__card::after{content:'↗';position:absolute;right:1.4rem;bottom:1.5rem;color:var(--merchant-green);font-size:1.2rem;pointer-events:none}
.merchant-directory__card p{margin:0;padding:.3rem .65rem;background:#edf5f1;color:var(--merchant-green);border-radius:100px;font-size:.78rem;font-weight:700}
.merchant-directory__card:hover{transform:translateY(-3px);border-color:#77a795;box-shadow:0 10px 24px #172b4610}
.merchant-directory__layout--detail{grid-template-columns:minmax(0,1fr) 290px;gap:2rem}
.merchant-directory__offers{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin-top:1.5rem}
.merchant-directory__layout--detail .merchant-directory__offers{grid-template-columns:1fr}
.merchant-directory__layout>div>p{color:#637284;font-size:.88rem;line-height:1.6}
.merchant-offer{display:flex;flex-direction:column;align-items:flex-start;gap:.9rem;padding:1.75rem;border:1px solid var(--merchant-line);border-radius:18px;background:#fff;box-shadow:0 5px 20px #172b4606}
.merchant-offer__merchant{margin:0;color:var(--merchant-green);font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.merchant-offer h3{margin:0;font-size:1.3rem;line-height:1.4;letter-spacing:-.02em}
.merchant-offer>p:not(.merchant-offer__merchant){margin:0;color:#627184;font-size:.86rem;line-height:1.6}
.merchant-offer details{width:100%;font-size:.93rem;line-height:1.65;color:#526579}.merchant-offer summary{cursor:pointer;font-weight:600;color:var(--merchant-ink)}.merchant-offer details p{margin:.7rem 0}
.merchant-offer__cta,.merchant-directory__info>a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;box-sizing:border-box;margin-top:auto;padding:.8rem 1.2rem;background:var(--merchant-ink);border:1px solid var(--merchant-ink);border-radius:9px;color:#fff!important;-webkit-text-fill-color:#fff;font-size:.9rem;font-weight:700;line-height:1.3;text-decoration:none}
.merchant-offer__cta:hover,.merchant-directory__info>a:hover{background:var(--merchant-green);border-color:var(--merchant-green)}
.merchant-offer__code{width:100%;box-sizing:border-box;display:flex;align-items:center;gap:.75rem;margin:.2rem 0;padding:.8rem;border:1px dashed #85aa98;border-radius:10px;background:#f3f8f5}
.merchant-offer__code code{font-size:1.1rem;font-weight:800;letter-spacing:.08em;color:var(--merchant-green);overflow-wrap:anywhere}
.merchant-offer__code button{margin-left:auto;padding:.6rem .8rem;min-height:40px;border:1px solid #bed3c8;border-radius:7px;background:#fff;color:var(--merchant-green);font:inherit;font-size:.8rem;font-weight:700;cursor:pointer}.merchant-offer__code [role=status]{flex-basis:100%;font-size:.8rem}
.merchant-directory__info{position:sticky;top:90px;padding:1.5rem;border:1px solid var(--merchant-line);border-radius:18px;background:#eef5f3;box-shadow:none}.merchant-directory__info h2{font-size:1.25rem}.merchant-directory__info p{color:#526579;font-size:.9rem;line-height:1.7}.merchant-directory__info>a{margin-top:.5rem}
.merchant-directory a:focus-visible,.merchant-directory button:focus-visible,.merchant-directory input:focus-visible,.merchant-directory summary:focus-visible{outline:3px solid #36836b;outline-offset:4px}
.merchant-directory__card:focus-within{outline:3px solid #36836b;outline-offset:3px}
body:has(.merchant-directory) .layout-main>article.site-content{max-width:1200px;margin:3rem auto 0;padding:2rem;border-top:1px solid #dce5e8;color:#526579;box-sizing:border-box}
@media(max-width:1000px){.merchant-directory__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px){.merchant-directory__layout--detail{grid-template-columns:1fr}.merchant-directory__info{position:static}.merchant-directory__header{border-radius:18px}.merchant-directory__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.merchant-directory__offers{grid-template-columns:1fr}.merchant-directory__grid{gap:.7rem}.merchant-directory__card{padding:1rem;min-height:165px}.merchant-directory__card img{max-width:100%;height:54px}.merchant-directory__card h3{font-size:.95rem}.merchant-directory__card::after{right:.85rem;bottom:1rem}.merchant-directory__header img{float:none;margin:0 0 1.5rem}.merchant-offer{padding:1.25rem}.merchant-offer__cta{width:100%}.merchant-directory__header h1{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){.merchant-directory__card{transition:none}}

/* Äänikirjapalveluiden sivuilla vertailulinkki korvaa jälleenmyyjämurupolun. */
body:has(.audio-service-links) .merchant-directory>nav[aria-label="Murupolku"]{display:none}
.site-content .audio-service-links{margin:0 0 2rem;padding:1.15rem 1.35rem;background:#eef5f2;border:1px solid #d2e3db;border-left:4px solid #226b59;border-radius:12px}
.site-content .audio-service-links>a{display:inline-flex;align-items:center;gap:.65rem;color:#185140;font-size:1rem;text-decoration:underline;text-underline-offset:4px}
.site-content .audio-service-links p{margin:.4rem 0 0;color:#40566c;font-size:.9rem;line-height:1.6}
.site-content .audio-service-links>a:focus-visible{outline:3px solid #226b59;outline-offset:4px}