/*
 * TippyTaps v2 — venue detail (single-tt_clinics: clinics, salons, hotels).
 * Reference: design_handoff_tippytaps/design/Klinika.dc.html. Loaded only under
 * tt_v2(), after v2.css (inc/enqueue.php: v2-{context}.css).
 *
 * ⚠️ EVERY RULE STARTS WITH `body.tt-v2` — one element above the old `.tt-site …`
 * rules in single-clinic.css / booking.css, so they lose by specificity and not
 * by load order (LiteSpeed reorders combined CSS for guests).
 *
 * ⚠️ The doctor page loads single-clinic.css but NOT this file, so nothing here
 * reaches it — the shared pieces (.block, .crumbs, reviews) look v2 on the venue
 * page only until the doctor page gets its own v2 file.
 *
 * ⚠️ No transform / filter / backdrop-filter on .dbody, .dside or their parents:
 * any of them would make the mobile booking bar (.tt-book__bar, position:fixed,
 * printed inside .dside) stick to that box instead of the screen.
 */

/* ---------- page frame ---------- */
/* The design's container: 1360px, 16–40px gutter. Only the wrap that holds
   this page — the header and footer have their own .wrap. */
body.tt-v2 .wrap:has(> .clinic-detail){ max-width:1360px; padding:0 clamp(16px,3vw,40px); }
body.tt-v2 .clinic-detail{ padding:clamp(20px,3vw,36px) 0 0; }

body.tt-v2 .clinic-detail .crumbs{ margin:0 0 18px; gap:8px; font-family:var(--sans); font-size:14px; font-weight:400;
  letter-spacing:0; text-transform:none; color:var(--muted); }
body.tt-v2 .clinic-detail .crumbs a,
body.tt-v2 .clinic-detail .crumbs a.link{ color:var(--muted); font-weight:400; }
body.tt-v2 .clinic-detail .crumbs [aria-current]{ color:var(--ink); font-weight:600; }
@media (hover:hover){ body.tt-v2 .clinic-detail .crumbs a.link:hover{ color:var(--green); } }

/* ---------- hero ---------- */
body.tt-v2 .dhero{ position:relative; overflow:hidden; background:var(--surface); border:0; box-shadow:none;
  border-radius:var(--tt-r); padding:clamp(24px,4vw,52px); }
body.tt-v2 .dhead{ position:relative; z-index:1; padding:0; display:flex; flex-direction:column; align-items:flex-start;
  gap:20px; flex-wrap:nowrap; }
/* White tile for the venue's own logo; initials when there is none. */
body.tt-v2 .dhead .logo{ width:120px; height:120px; margin:0; border:0; border-radius:var(--tt-r); background:#fff;
  box-shadow:0 20px 40px -26px rgba(21,52,39,.5); font-family:var(--disp); font-weight:500; font-size:36px;
  letter-spacing:-.03em; color:var(--green); }
body.tt-v2 .dhead .logo img{ padding:10px; }
body.tt-v2 .dinfo{ flex:none; width:100%; min-width:0; display:flex; flex-wrap:wrap; align-items:center; gap:10px 22px;
  font-size:16px; }
body.tt-v2 .dinfo h1{ flex:0 0 100%; margin:0 0 10px; font-family:var(--disp); font-weight:500;
  font-size:clamp(38px,5vw,72px); line-height:.95; letter-spacing:-.05em; text-wrap:balance; overflow-wrap:break-word; }

/* Rating: one lime pill — a single star, the number and the count. */
body.tt-v2 .dinfo .rating{ margin:0; gap:6px; padding:7px 14px; border-radius:999px; background:var(--lime); color:var(--ink);
  font-size:16px; font-weight:700; white-space:nowrap; }
body.tt-v2 .dinfo .rating .tt-stars svg{ width:16px; height:16px; fill:var(--forest); }
body.tt-v2 .dinfo .rating .tt-stars svg:not(:first-child){ display:none; }
body.tt-v2 .dinfo .rating b{ font-weight:700; }
body.tt-v2 .dinfo .rating .rc{ color:var(--ink); font-weight:500; }

body.tt-v2 .dinfo .daddr{ margin:0; gap:6px; font-size:16px; font-weight:400; color:var(--ink-2); }
body.tt-v2 .dinfo .daddr svg{ width:16px; height:16px; color:currentColor; }
/* The district is a link in the design's address line, not a chip. */
body.tt-v2 .dinfo .part-chip{ background:none; border:0; padding:0; border-radius:0; font-size:16px; font-weight:600;
  color:var(--green-ink); }
body.tt-v2 .dinfo .part-chip.is-plain{ font-weight:400; color:var(--ink-2); }

/* Status: coloured text with a pulsing dot, like the cards (v2.css). */
body.tt-v2 .dinfo .dstatus{ margin:0; }
body.tt-v2 .dinfo .tt-status{ background:none; padding:0; gap:8px; font-size:16px; font-weight:700; }
body.tt-v2 .dinfo .tt-status.is-open{ color:var(--green-ink); }
body.tt-v2 .dinfo .tt-status.is-closed{ color:#7a877f; }
body.tt-v2 .dinfo .tt-status .dot{ position:relative; width:9px; height:9px; }
body.tt-v2 .dinfo .tt-status.is-open .dot{ background:var(--green); }
body.tt-v2 .dinfo .tt-status.is-open .dot::after{ content:""; position:absolute; inset:0; border-radius:50%;
  background:var(--green); animation:tt-v2-pulse 1.8s ease-out infinite; }

body.tt-v2 .dinfo .dbadges{ flex:0 0 100%; margin:0; gap:6px; }
body.tt-v2 .dinfo .badge{ font-size:13px; font-weight:700; padding:6px 12px; gap:6px; }
body.tt-v2 .dinfo .badge.sos{ background:#fbe3da; color:#b5431f; }
body.tt-v2 .dinfo .badge.verified{ background:#e3f1ea; color:var(--green-ink); }
body.tt-v2 .dinfo .badge.home{ background:#eef4c4; color:#3d4a10; }

/* Actions: green call pill, outline pills for the rest (and the heart). */
body.tt-v2 .dactions{ margin-top:4px; gap:10px; }
body.tt-v2 .dactions .btn{ display:inline-flex; align-items:center; gap:10px; padding:16px 24px; border-radius:var(--tt-r-btn);
  font-size:16px; font-weight:700; transition:background .2s, color .2s, border-color .2s; }
body.tt-v2 .dactions .btn svg{ width:18px; height:18px; stroke-width:1.6; }
body.tt-v2 .dactions .btn.call{ padding:16px 26px; background:var(--green); color:var(--surface); }
body.tt-v2 .dactions .btn.call svg{ transition:rotate .3s cubic-bezier(.3,1.8,.5,1); }
body.tt-v2 .dactions .btn.ghost{ background:transparent; color:var(--ink); border:1.5px solid var(--ink); }
body.tt-v2 .dactions .tt-fav__b.is-on{ color:var(--green-ink); border-color:var(--green); }
@media (hover:hover){
  body.tt-v2 .dactions .btn.call:hover{ background:var(--green-ink); color:var(--surface); transform:none; }
  body.tt-v2 .dactions .btn.call:hover svg{ rotate:-14deg; }
  body.tt-v2 .dactions .btn.ghost:hover{ background:var(--ink); color:var(--bg); border-color:var(--ink); transform:none; }
}
@media (max-width:600px){
  /* single-clinic.css shares the row out (call full width, the rest two per
     row); the row has to span the hero for that to work in a column. */
  body.tt-v2 .dactions{ align-self:stretch; gap:8px; }
  body.tt-v2 .dactions .btn{ padding:15px 18px; justify-content:center; }
}

/* The right half — markup only under tt_v2(). The card is the design's grid:
   two columns where both fit 460px, else the art stacks under the content. */
body.tt-v2 .dhero{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr)); gap:32px; align-items:center; }
/* Capped and centred: stacked under the content it would be the card's full
   width, and circles sized in % of that outgrow the fixed height. */
body.tt-v2 .tt-v2-dart{ position:relative; width:100%; max-width:600px; justify-self:center; height:clamp(300px,34vw,420px);
  min-width:0; pointer-events:none; }
/* The place name in outline letters, along the bottom edge. Flex end, not
   text-align: a long name ("Nové Mesto") then spills left under the photos
   instead of off the card's right edge. */
body.tt-v2 .tt-v2-dword{ position:absolute; left:0; right:0; bottom:-8px; display:flex; justify-content:flex-end;
  font-family:var(--disp); font-weight:650; font-size:clamp(80px,10vw,160px); line-height:.8; letter-spacing:-.07em;
  white-space:nowrap; color:transparent; -webkit-text-stroke:1.5px rgba(47,158,112,.45);
  user-select:none; transition:translate .4s; }
/* Three round photos: data-par drifts them with the cursor, data-bob floats
   the two small ones (tt.js; both off on touch / reduced motion). */
body.tt-v2 .tt-v2-dpic{ position:absolute; aspect-ratio:1; border-radius:50%; overflow:hidden; background:#c9d8cf;
  box-shadow:0 30px 60px -30px rgba(21,52,39,.5); transition:translate .4s; }
body.tt-v2 .tt-v2-dpic img{ display:block; width:100%; height:100%; object-fit:cover; }
body.tt-v2 .tt-v2-dpic.is-a{ left:6%; top:6%; width:52%; }
body.tt-v2 .tt-v2-dpic.is-b{ right:6%; top:0; width:38%; border:6px solid var(--surface); }
body.tt-v2 .tt-v2-dpic.is-c{ right:22%; bottom:16%; width:28%; border:6px solid var(--surface); }

/* ---------- body: main column + sidebar ---------- */
body.tt-v2 .dbody{ grid-template-columns:minmax(0,1fr) 380px; gap:24px; margin-top:24px; }
body.tt-v2 .dmain,
body.tt-v2 .dside{ display:flex; flex-direction:column; gap:20px; }
body.tt-v2 .dside{ top:110px; }
@media (min-width:901px) and (max-width:1100px){
  body.tt-v2 .dbody{ grid-template-columns:minmax(0,1fr) 340px; }
}
@media (max-width:900px){
  body.tt-v2 .dbody{ gap:20px; margin-top:20px; }
  body.tt-v2 .dmain,
  body.tt-v2 .dside{ display:contents; }
}

body.tt-v2 .clinic-detail .block{ margin:0; border:0; box-shadow:none; background:var(--surface); border-radius:var(--tt-r);
  padding:clamp(22px,3vw,36px); }
body.tt-v2 .clinic-detail .aside-block{ padding:26px; }
body.tt-v2 .clinic-detail .block .bh{ margin:0 0 18px; font-family:var(--disp); font-weight:500; font-size:32px;
  line-height:1.05; letter-spacing:-.035em; }
body.tt-v2 .clinic-detail .block .bh .sub{ font-family:var(--sans); font-size:15px; font-weight:500; letter-spacing:0; color:var(--muted); }
body.tt-v2 .clinic-detail .aside-block .bh{ font-size:24px; letter-spacing:-.03em; margin-bottom:14px; }

body.tt-v2 .clinic-detail .note{ margin-top:16px; font-size:13px; font-weight:500; color:#7a877f; }

/* O nás */
body.tt-v2 .clinic-detail .prose{ font-size:17px; line-height:1.65; color:#3a4a40; text-wrap:pretty; }
body.tt-v2 .clinic-detail .prose a{ color:var(--green-ink); }

/* ---------- species: photo tiles (markup under tt_v2()) ---------- */
body.tt-v2 .tt-v2-species{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
body.tt-v2 .tt-v2-species .sp{ position:relative; height:190px; border-radius:var(--tt-r); overflow:hidden; background:#c9d8cf; }
body.tt-v2 .tt-v2-species .sp-img{ display:block; width:100%; height:100%; object-fit:cover;
  transition:scale .7s cubic-bezier(.2,.8,.2,1), translate .7s; }
body.tt-v2 .tt-v2-species .sp.is-icon{ background:var(--bg); }
body.tt-v2 .tt-v2-species .sp-ico{ display:grid; place-items:center; height:100%; padding-bottom:36px; color:var(--forest); }
body.tt-v2 .tt-v2-species .sp-ico svg{ width:56px; height:56px; }
body.tt-v2 .tt-v2-species .sp-l{ position:absolute; left:12px; bottom:12px; max-width:calc(100% - 24px); padding:8px 14px;
  border-radius:16px; background:var(--surface); font-weight:700; font-size:15px; line-height:1.2; transition:background .3s;
  /* A long single word ("Meerschweinchen") ran past the tile; two words wrapped
     ragged ("Reptilien und / Amphibien"). Hyphenation follows the page's lang,
     balance evens the lines; 16px corners suit one line and two. */
  hyphens:auto; -webkit-hyphens:auto; overflow-wrap:break-word; text-wrap:balance; }
@media (hover:hover){
  body.tt-v2 .tt-v2-species .sp:hover .sp-img{ scale:1.12; translate:0 -6px; }
  body.tt-v2 .tt-v2-species .sp:hover .sp-l{ background:var(--lime); }
}
@media (max-width:640px){
  body.tt-v2 .tt-v2-species{ grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:10px; }
  body.tt-v2 .tt-v2-species .sp{ height:150px; border-radius:var(--tt-r); }
  body.tt-v2 .tt-v2-species .sp-l{ left:8px; bottom:8px; max-width:calc(100% - 16px); padding:6px 10px; font-size:13.5px; }
}

/* ---------- chips ---------- */
body.tt-v2 .clinic-detail .plainchips{ gap:8px; }
/* Odbornosti: green outline. */
body.tt-v2 .clinic-detail .chip-odb{ padding:9px 16px; border-radius:999px; background:transparent; border:1.5px solid var(--green);
  color:var(--green-ink); font-size:15px; font-weight:600; }
/* Služby, Vlastnosti (and the species chips outside v2's tile markup). */
body.tt-v2 .clinic-detail .chip-svc{ padding:7px 13px; border-radius:999px; background:var(--bg); border:0;
  color:var(--ink); font-size:14px; font-weight:500; }
body.tt-v2 .clinic-detail .b-services .plainchips,
body.tt-v2 .clinic-detail .b-features .plainchips{ gap:6px; }
/* "+N" — the design's dark pill. Same button, same tt-ui.js toggle. */
body.tt-v2 .clinic-detail .chip-more{ padding:7px 14px; border-radius:var(--tt-r-btn); border:0; background:var(--ink); color:var(--bg);
  font-size:14px; font-weight:700; transition:background .2s; }
@media (hover:hover){ body.tt-v2 .clinic-detail .chip-more:hover{ background:var(--green); color:var(--surface); border-style:none; } }

/* ---------- cenník (not in the design: the same card language) ---------- */
body.tt-v2 .clinic-detail .acc{ border:1.5px solid rgba(24,39,31,.08); border-radius:var(--tt-r); }
body.tt-v2 .clinic-detail .acc details{ border-bottom:1px solid rgba(24,39,31,.08); }
body.tt-v2 .clinic-detail .acc details:last-child{ border-bottom:0; }
body.tt-v2 .clinic-detail .acc summary{ padding:16px 18px; background:transparent; font-size:16px; font-weight:700; }
body.tt-v2 .clinic-detail .acc summary .caret{ color:var(--green-ink); }
body.tt-v2 .clinic-detail .acc summary .gcnt{ font-size:14px; font-weight:500; color:#7a877f; }
body.tt-v2 .clinic-detail .acc .items{ padding:0 18px 14px 46px; }
body.tt-v2 .clinic-detail .acc .prow{ font-size:15px; font-weight:500; border-top:1px dashed rgba(24,39,31,.1); }
body.tt-v2 .clinic-detail .acc .prow .pv{ font-weight:700; }
@media (hover:hover){ body.tt-v2 .clinic-detail .acc summary:hover{ background:var(--bg); } }
@media (max-width:640px){ body.tt-v2 .clinic-detail .acc .items{ padding-left:18px; } }

/* ---------- náš tím ---------- */
body.tt-v2 .clinic-team{ grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr)); gap:12px; }
body.tt-v2 .team-member{ gap:16px; padding:14px 20px 14px 14px; border:0; border-radius:var(--tt-r); background:var(--bg); color:var(--ink);
  transition:background .3s; }
body.tt-v2 .team-member::after{ content:""; flex:none; width:20px; height:20px; margin-left:auto; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:translate .3s; }
body.tt-v2 .team-member .tm-photo{ width:64px; height:64px; border-radius:22px; background:var(--green);
  transition:rotate .4s var(--tt-spring), scale .4s; }
body.tt-v2 .team-member .tm-initials{ font-family:var(--disp); font-weight:500; font-size:22px; color:var(--surface); }
body.tt-v2 .team-member .tm-name{ font-family:var(--disp); font-weight:500; font-size:20px; letter-spacing:-.02em; line-height:1.15; }
body.tt-v2 .team-member .tm-role{ color:var(--ink-2); font-size:15px; font-weight:400; }
body.tt-v2 .team-member .tm-disc{ color:#7a877f; font-size:13px; font-weight:400; }
body.tt-v2 .clinic-detail .team-all{ margin-top:18px; font-size:16px; font-weight:700; color:var(--green-ink); }
@media (hover:hover){
  body.tt-v2 .team-member:hover{ background:var(--lime); border-color:transparent; transform:none; }
  body.tt-v2 .team-member:hover .tm-photo{ rotate:-8deg; scale:1.06; }
  body.tt-v2 .team-member:hover::after{ translate:4px 0; }
}

/* ---------- hodnotenia ----------
   One grid: the heading and "Pridať hodnotenie" share the first row, as in the
   design; the form opens right under the summary, then the list. `order` only
   — the DOM and reviews.js are untouched. */
body.tt-v2 .tt-reviews{ display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:16px; row-gap:20px; align-items:start; }
body.tt-v2 .tt-reviews > *{ grid-column:1 / -1; min-width:0; }
body.tt-v2 .clinic-detail .tt-reviews > .bh{ grid-column:1; grid-row:1; align-self:center; margin:0; }
body.tt-v2 .tt-reviews > .rev-toggle{ grid-column:2; grid-row:1; }
body.tt-v2 .tt-reviews > .rev-summary{ order:1; }
body.tt-v2 .tt-reviews > .rev-form{ order:2; }
body.tt-v2 .tt-reviews > .rev-tabs{ order:3; }
body.tt-v2 .tt-reviews > .rev-list,
body.tt-v2 .tt-reviews > .tt-empty{ order:4; }
body.tt-v2 .tt-reviews > .note{ order:5; margin:0; }
@media (max-width:480px){
  body.tt-v2 .tt-reviews{ grid-template-columns:minmax(0,1fr); row-gap:16px; }
  body.tt-v2 .tt-reviews > .rev-toggle{ grid-column:1; grid-row:2; justify-self:start; }
}

body.tt-v2 .tt-reviews .rev-toggle{ margin:0; padding:12px 20px; border-radius:var(--tt-r-btn); border:1.5px solid var(--green);
  background:transparent; color:var(--green-ink); font-size:15px; font-weight:700; transition:background .2s, color .2s; }
body.tt-v2 .tt-reviews .rev-toggle[aria-expanded="true"]{ background:var(--green); color:var(--surface); }
@media (hover:hover){
  body.tt-v2 .tt-reviews .rev-toggle:hover{ background:var(--green); color:var(--surface); border-color:var(--green); transform:none; }
}

/* Summary: the forest tile with the big lime number, the sources beside it. */
body.tt-v2 .tt-reviews .rev-summary{ gap:16px; align-items:stretch; margin:0; padding:0; border:0; }
body.tt-v2 .tt-reviews .rev-big{ flex:0 0 auto; min-width:200px; display:flex; flex-direction:column; gap:6px; text-align:left;
  padding:22px 26px; border-radius:var(--tt-r); background:var(--forest); color:var(--bg); }
@media (max-width:640px){ body.tt-v2 .tt-reviews .rev-big{ flex:1 1 100%; } }
body.tt-v2 .tt-reviews .rev-big .num{ font-family:var(--disp); font-weight:500; font-size:64px; line-height:.9; letter-spacing:-.05em; color:var(--lime); }
body.tt-v2 .tt-reviews .rev-big .rating{ justify-content:flex-start; margin:0; }
body.tt-v2 .tt-reviews .rev-big .tt-stars svg{ width:18px; height:18px; }
/* tt_stars_html() paints with fill attributes; CSS fill outranks them. */
body.tt-v2 .tt-reviews .rev-big .tt-stars [fill="#e2a615"]{ fill:var(--lime); }
body.tt-v2 .tt-reviews .rev-big .tt-stars [fill="rgba(24,39,31,.16)"]{ fill:rgba(242,238,228,.22); }
body.tt-v2 .tt-reviews .rev-big .lbl{ margin:0; font-size:14px; font-weight:400; color:rgba(242,238,228,.75); }
body.tt-v2 .tt-reviews .rev-break{ flex:1 1 260px; align-content:center; gap:12px; padding:22px 26px; border-radius:var(--tt-r);
  border:1.5px solid rgba(24,39,31,.1); font-size:15px; }
body.tt-v2 .tt-reviews .rev-break .bar{ height:8px; background:var(--bg); }
body.tt-v2 .tt-reviews .rev-break .val{ color:var(--ink-2); font-weight:600; }
body.tt-v2 .tt-reviews .srcbadge{ font-size:12px; font-weight:700; padding:4px 10px; border-radius:999px; }
body.tt-v2 .tt-reviews .srcbadge.paws{ background:#e3f1ea; }
body.tt-v2 .tt-reviews .srcbadge.google{ background:var(--surface); border:1px solid rgba(24,39,31,.14); }

body.tt-v2 .tt-reviews .rev-tabs{ margin:0; gap:8px; }
body.tt-v2 .tt-reviews .rev-tabs button{ padding:9px 16px; border-radius:var(--tt-r-btn); border:1.5px solid rgba(24,39,31,.14);
  background:transparent; color:var(--ink); font-size:14px; font-weight:600; }
body.tt-v2 .tt-reviews .rev-tabs button.active{ background:var(--ink); border-color:var(--ink); color:var(--bg); }
@media (hover:hover){
  body.tt-v2 .tt-reviews .rev-tabs button:not(.active):hover{ border-color:var(--ink); background:transparent; color:var(--ink); }
}

/* The list: bordered cards in two balanced columns. No `display` on .review —
   the source tabs hide cards with the `hidden` attribute. */
body.tt-v2 .tt-reviews .rev-list{ margin:0; columns:2 300px; column-gap:14px; }
body.tt-v2 .tt-reviews .review{ position:relative; break-inside:avoid; margin:0 0 14px; padding:20px; border-radius:var(--tt-r);
  border:1.5px solid rgba(24,39,31,.08); }
body.tt-v2 .tt-reviews .review .rtop{ gap:12px; align-items:flex-start; }
body.tt-v2 .tt-reviews .review .rav{ width:42px; height:42px; font-size:16px; font-weight:700; color:var(--ink); background:var(--lime); }
body.tt-v2 .tt-reviews .review:nth-child(5n+2) .rav{ background:var(--tt-pink); }
body.tt-v2 .tt-reviews .review:nth-child(5n+3) .rav{ background:#c9e4d6; }
body.tt-v2 .tt-reviews .review:nth-child(5n+4) .rav{ background:#f4c8b5; }
body.tt-v2 .tt-reviews .review:nth-child(5n) .rav{ background:#e6e0cf; }
body.tt-v2 .tt-reviews .review .rav.has-photo{ background:none; }
body.tt-v2 .tt-reviews .review .rnm{ font-size:16px; font-weight:700; gap:6px 8px; }
body.tt-v2 .tt-reviews .review .tt-stars svg{ width:15px; height:15px; }
body.tt-v2 .tt-reviews .review .tt-stars [fill="#e2a615"]{ fill:var(--pop); }
body.tt-v2 .tt-reviews .review .rdate{ font-size:13px; font-weight:400; color:#7a877f; text-align:right; }
body.tt-v2 .tt-reviews .rtext{ margin-top:12px; font-size:15px; line-height:1.6; color:#3a4a40; white-space:pre-line; overflow-wrap:break-word; }
body.tt-v2 .tt-reviews .reply{ margin:12px 0 0; padding:12px 14px; border:0; border-radius:var(--tt-r); background:var(--bg); }
body.tt-v2 .tt-reviews .reply .rtext{ margin-top:2px; }

/* Long review: clamped until its "Čítať viac" checkbox is ticked (markup in
   reviews.php under tt_v2()). */
body.tt-v2 .tt-reviews .rv-more-cb{ position:absolute; width:1px; height:1px; margin:0; padding:0; opacity:0; pointer-events:none; }
body.tt-v2 .tt-reviews .rtext.is-long{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:5; overflow:hidden; }
body.tt-v2 .tt-reviews .rv-more-cb:checked ~ .rtext.is-long{ display:block; -webkit-line-clamp:unset; overflow:visible; }
body.tt-v2 .tt-reviews .rv-more{ display:inline-block; margin-top:10px; cursor:pointer; color:var(--green-ink); font-size:14px; font-weight:700; }
body.tt-v2 .tt-reviews .rv-more .l,
body.tt-v2 .tt-reviews .rv-more-cb:checked ~ .rv-more .m{ display:none; }
body.tt-v2 .tt-reviews .rv-more-cb:checked ~ .rv-more .l{ display:inline; }
body.tt-v2 .tt-reviews .rv-more-cb:focus-visible ~ .rv-more{ outline:2px solid var(--green); outline-offset:3px; border-radius:4px; }
@media (hover:hover){ body.tt-v2 .tt-reviews .rv-more:hover{ color:var(--green); } }

body.tt-v2 .tt-reviews .tt-empty{ padding:22px 24px; border-radius:var(--tt-r); background:var(--bg); text-align:left; font-weight:500; color:var(--ink-2); }
body.tt-v2 .tt-reviews .tt-empty b{ font-weight:500; font-size:22px; letter-spacing:-.03em; }

/* The form: same fields, handlers and star radios — only the look. */
body.tt-v2 .tt-reviews .rev-form{ margin:0; padding:22px; gap:14px; border:0; border-radius:var(--tt-r); background:var(--bg); }
body.tt-v2 .tt-reviews .rev-form label{ font-size:14px; font-weight:600; color:var(--ink-2); }
body.tt-v2 .tt-reviews .rev-form input[type=text],
body.tt-v2 .tt-reviews .rev-form input[type=email],
body.tt-v2 .tt-reviews .rev-form textarea{ padding:14px 16px; border-radius:var(--tt-r-btn); border:1.5px solid rgba(24,39,31,.12);
  background:var(--surface); font-size:16px; font-weight:400; }
body.tt-v2 .tt-reviews .rev-form input:focus,
body.tt-v2 .tt-reviews .rev-form textarea:focus{ border-color:var(--green); box-shadow:none; }
/* Outlined coral stars, filled up to the choice — single-clinic.css paints the
   chosen ones with var(--star) from data-fill; only the colours change here. */
body.tt-v2 .tt-reviews .rf-stars{ --star:var(--pop); gap:4px; }
body.tt-v2 .tt-reviews .rf-star span[aria-hidden]{ font-size:32px; color:transparent; -webkit-text-stroke:1.5px var(--pop);
  transition:color .15s, scale .2s; display:inline-block; }
@media (hover:hover){ body.tt-v2 .tt-reviews .rf-star:hover span[aria-hidden]{ scale:1.2; } }
body.tt-v2 .tt-reviews .rf-actions .btn.call{ padding:14px 24px; border-radius:var(--tt-r-btn); background:var(--green); color:var(--surface);
  font-size:16px; font-weight:700; }
@media (hover:hover){ body.tt-v2 .tt-reviews .rf-actions .btn.call:hover{ background:var(--green-ink); transform:none; } }

/* ---------- sidebar ---------- */
/* Opening hours: today on a soft green row, closed days in coral. */
body.tt-v2 .clinic-detail table.hours{ border-collapse:separate; border-spacing:0; font-size:15px; }
body.tt-v2 .clinic-detail table.hours td{ padding:10px 12px; border:0; }
body.tt-v2 .clinic-detail table.hours td:last-child{ text-align:right; }
body.tt-v2 .clinic-detail table.hours .day{ color:var(--ink); font-weight:400; }
body.tt-v2 .clinic-detail table.hours tr.today td{ background:#e3f1ea; color:var(--ink); font-weight:700; }
body.tt-v2 .clinic-detail table.hours tr.today td:first-child{ border-radius:14px 0 0 14px; }
body.tt-v2 .clinic-detail table.hours tr.today td:last-child{ border-radius:0 14px 14px 0; }
body.tt-v2 .clinic-detail table.hours tr.today .day::after{ color:var(--green-ink); font-weight:700; }
body.tt-v2 .clinic-detail table.hours .closed{ color:#c94e2a; font-weight:400; }
body.tt-v2 .clinic-detail .hours-note{ margin:0; font-size:16px; line-height:1.5; }

/* Jazyky: the design's small caps label and plain pills. */
body.tt-v2 .clinic-detail .b-langs .bh{ margin-bottom:12px; font-family:var(--sans); font-size:13px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
body.tt-v2 .clinic-detail .langpills .lp{ padding:7px 14px; border:0; border-radius:999px; background:var(--bg); font-size:15px; font-weight:600; }

/* Poloha: the existing embed in a rounded inset card. */
body.tt-v2 .clinic-detail .b-map{ padding:10px; }
body.tt-v2 .clinic-detail .b-map .bh{ padding:14px 16px 0; margin-bottom:12px; }
body.tt-v2 .clinic-detail .b-map .map{ border:0; border-radius:var(--tt-r); }
body.tt-v2 .clinic-detail .b-map .map.is-embed iframe{ height:240px; border-radius:var(--tt-r); filter:saturate(.7); }
body.tt-v2 .clinic-detail .b-map .note{ margin:0; padding:12px 14px 10px; font-size:15px; font-weight:600; color:var(--ink); }

/* Claim box: text in the page's voice; its coral button is account.css's. */
body.tt-v2 .clinic-detail .acc-box .acc-hint{ font-size:15px; line-height:1.5; color:var(--ink-2); }

/* ---------- booking card (booking.css / booking.js untouched) ---------- */
body.tt-v2 .tt-book .tt-book__head{ padding:24px 26px 14px; border-bottom-color:rgba(24,39,31,.08); }
body.tt-v2 .tt-book .tt-book__sub{ font-size:15px; color:var(--muted); }
body.tt-v2 .tt-book .tt-book__steps{ padding:8px 26px 4px; }
body.tt-v2 .tt-book .tt-book__st h3{ font-family:var(--sans); font-size:17px; font-weight:700; }
body.tt-v2 .tt-book .tt-book__chip{ border-color:rgba(24,39,31,.14); background:transparent; font-size:14px; }
body.tt-v2 .tt-book .tt-book__chip[aria-pressed="true"]{ background:#e3f1ea; border-color:var(--green); color:var(--green-ink); }
body.tt-v2 .tt-book .tt-book__chip.is-go{ background:var(--green); border-color:var(--green); color:var(--surface); }
body.tt-v2 .tt-book .tt-book__slot{ background:#e3f1ea; color:var(--green-ink); }
body.tt-v2 .tt-book .tt-book__slot[aria-pressed="true"]{ background:var(--green); color:var(--surface); }
body.tt-v2 .tt-book .tt-book__pet{ border-radius:var(--tt-r-btn); }
body.tt-v2 .tt-book .tt-book__inp{ border-radius:var(--tt-r-btn); border-color:rgba(24,39,31,.12); padding:11px 13px; }
body.tt-v2 .tt-book .tt-book__inp:focus{ border-color:var(--green); }
body.tt-v2 .tt-book .tt-book__foot{ padding:16px 26px 20px; border-top-color:rgba(24,39,31,.08); }
body.tt-v2 .tt-book .tt-book__go,
body.tt-v2 .tt-book__bar .tt-book__go{ border-radius:var(--tt-r-btn); padding:15px 20px; background:var(--green); color:var(--surface);
  font-size:16px; font-weight:700; transition:background .2s; }
body.tt-v2 .tt-book .tt-book__go:disabled{ background:var(--bg); color:#7a877f; }
@media (hover:hover){
  body.tt-v2 .tt-book .tt-book__chip:not([aria-pressed="true"]):hover{ border-color:var(--green); background:transparent; }
  body.tt-v2 .tt-book .tt-book__go:hover:not(:disabled),
  body.tt-v2 .tt-book__bar .tt-book__go:hover{ background:var(--green-ink); color:var(--surface); }
}
body.tt-v2 .tt-book .tt-book__ticket{ border-radius:var(--tt-r); background:var(--bg); }
/* Phone bar: only its look — display, position and visibility stay with
   booking.css (it is hidden above 900px and while the cookie banner is open). */
@media (max-width:900px){
  body.tt-v2 .tt-book__bar{ background:var(--surface); border-top:0; border-radius:var(--tt-r) var(--tt-r) 0 0;
    box-shadow:0 -14px 34px -20px rgba(21,52,39,.45); padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px)); }
  body.tt-v2 .tt-book__bar .tt-book__go{ padding:13px 22px; font-size:15px; }
  body.tt-v2 .tt-book__bar .tt-book__recap{ color:var(--ink-2); }
}

/* ---------- podobné … v okolí ---------- */
/* The cards are v2's wide PlaceCard (v2.css), so they stack, as in the design. */
body.tt-v2 .clinic-detail .similar-wrap{ margin-top:clamp(40px,6vw,72px); }
body.tt-v2 .clinic-detail .similar-wrap .bh-section{ margin:0 0 20px; font-family:var(--disp); font-weight:500;
  font-size:clamp(36px,4.6vw,64px); line-height:.95; letter-spacing:-.05em; }
body.tt-v2 .clinic-detail .similar-grid{ grid-template-columns:minmax(0,1fr); gap:14px; }

/* ---------- motion off ---------- */
@media (prefers-reduced-motion:reduce){
  body.tt-v2 .dinfo .tt-status.is-open .dot::after{ animation:none; }
  body.tt-v2 .tt-v2-species .sp-img,
  body.tt-v2 .team-member,
  body.tt-v2 .team-member .tm-photo,
  body.tt-v2 .tt-v2-dword,
  body.tt-v2 .tt-v2-dpic{ transition:none; }
}

/* Fotografie gallery in v2: the design's photo radius. */
body.tt-v2 .tt-gallery a{ border-radius:var(--tt-r); }