/* VocalSteamer additions to the Eyolo theme: only what the theme has no style for
   (tables, the bridge box, the product card, their buttons, plain text pages).
   Page layout, type and colour all come from the theme's own stylesheets.
   Loaded after them by scripts/vs-build.mjs. */

/* header pill is a link now; footer Contact column */
a.eyolo__subscribe_btn{text-decoration:none}
#eyolo__footer .textwidget a{color:inherit;text-decoration:underline;text-underline-offset:4px}
#eyolo__footer .textwidget p + p{margin-top:10px}

/* plain text pages and the text blocks added to home, about and contact */
.vs-text{max-width:860px;margin:0 auto}
.contained_page .vs-text{padding:80px 0 100px}
.vs-contact-more{padding:70px 0 0}
.vs-home-text{max-width:860px;width:100%}
.vs-about-text a,.vs-lead a{color:#ff4848;text-decoration:underline;text-underline-offset:5px}
.vs-about-text a:hover,.vs-lead a:hover{text-decoration:none}
a.vs-mail{color:inherit;text-decoration:none}
.vs-about-text p{margin:0}
.vs-about-more{padding:70px 0;margin-bottom:0}
img.vs-about-photo{object-fit:cover;aspect-ratio:245/290;width:245px;height:auto}
.vs-form-note{display:block;margin-top:12px;font-size:13px;line-height:1.5;opacity:.85}

/* article figures and tables */
.post-content .vs-figure{margin:30px 0}
.post-content .vs-figure img{width:100%;height:auto;border-radius:8px;display:block}
.vs-table{margin:26px 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.vs-table table{width:100%;min-width:560px;border-collapse:collapse;font-size:15px;line-height:1.5;background:rgba(255,255,255,.5)}
.vs-table th,.vs-table td{border:1px solid rgba(24,26,43,.18);padding:10px 12px;text-align:left;vertical-align:top}
.vs-table th{background:rgba(24,26,43,.07);color:var(--hc,#181a2b);font-weight:600}

/* bridge box and product card */
.vs-bridge,.vs-product-card{margin:38px 0;padding:26px 28px;border-radius:8px;background:#f4f2e6;border:1px solid #dbd8bd}
.post-content .vs-bridge h2,.post-content .vs-product-card h3{margin:0 0 10px;font-size:24px;line-height:1.25}
.post-content .vs-bridge p,.post-content .vs-product-card p{margin:0 0 12px}
.vs-product-card{display:grid;grid-template-columns:190px 1fr;column-gap:26px;align-items:start}
.vs-product-card > *{grid-column:2}
.vs-product-card > img{grid-column:1;grid-row:1 / span 6;width:190px;height:190px;object-fit:contain;border-radius:8px;background:#fff}
.vs-ownership{font-size:13px;opacity:.85}
.post-content .vs-bridge .vs-ownership{margin:16px 0 0}
.post-content .vs-product-card .vs-ownership{margin:4px 0 12px}
.post-content a.vs-button{display:inline-block;margin:6px 10px 0 0;padding:13px 22px;border-radius:999px;background:var(--hc,#181a2b);color:#fff;text-decoration:none;font-weight:600;font-size:15px;line-height:1.2;justify-self:start}
.post-content a.vs-button.vs-button-secondary{background:transparent;color:var(--hc,#181a2b);border:1.5px solid var(--hc,#181a2b)}
.vs-pending{padding:12px 16px;border:1px dashed rgba(24,26,43,.4);border-radius:8px}

@media(max-width:640px){
  .contained_page .vs-text{padding:50px 0 70px}
  .vs-product-card{grid-template-columns:1fr}
  .vs-product-card > *{grid-column:1}
  .vs-product-card > img{grid-row:auto;width:100%;max-width:240px;height:auto;margin:0 0 14px}
  .vs-bridge,.vs-product-card{padding:20px 18px}
  .post-content a.vs-button{display:block;text-align:center;margin-right:0}
}