/* Cookie consent banner. Uses the same custom properties as style.css. */

.clg-consent{
  position:fixed;left:0;right:0;bottom:0;z-index:9000;
  padding:16px clamp(14px,4vw,28px) calc(16px + env(safe-area-inset-bottom));
  background:var(--white,#fff);
  border-top:1px solid var(--line,#ded8d1);
  box-shadow:0 -14px 40px rgba(34,28,22,.14);
  font-size:.92rem;
  max-height:70vh;overflow-y:auto;
}
.clg-consent[hidden]{display:none}

.clg-consent-inner{
  max-width:1140px;margin:0 auto;
  display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;justify-content:space-between;
}
.clg-consent-text{flex:1 1 420px;min-width:0;max-width:100%}
.clg-consent-text h2{
  margin:0 0 .3em;font-size:1.02rem;font-weight:800;
  color:var(--ink,#221f1b);font-family:inherit;
}
.clg-consent-text p{margin:0;color:var(--muted,#6b645b);line-height:1.55;font-size:.88rem}
.clg-consent-text a{color:var(--coral-dark,#c33d2f);text-decoration:underline}

.clg-consent-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;flex:0 0 auto}
.clg-consent-actions .btn{min-height:44px;padding:.62em 1.3em;font-size:.9rem}
.clg-c-link{
  border:0;background:none;padding:.62em .5em;cursor:pointer;
  color:var(--ink-2,#4f4942);font-weight:700;font-size:.88rem;text-decoration:underline;
}
.clg-c-link:hover{color:var(--ink,#221f1b)}

.clg-consent-detail{
  max-width:1140px;margin:14px auto 0;padding-top:14px;
  border-top:1px solid var(--line-soft,#ebe6e0);
  max-height:min(46vh,380px);overflow-y:auto;
}
.clg-consent-detail[hidden]{display:none}

.clg-c-list{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:10px}
.clg-c-list li{
  border:1px solid var(--line-soft,#ebe6e0);border-radius:14px;background:#fbfaf8;
}
.clg-c-list li > label,
.clg-c-list li > div:first-child{
  display:flex;gap:14px;align-items:flex-start;justify-content:space-between;
  padding:12px 14px;cursor:pointer;margin:0;
}
.clg-c-list li > div:first-child{cursor:default}
.clg-c-list b{display:block;color:var(--ink,#221f1b);font-size:.9rem;margin-bottom:2px}
.clg-c-list span{display:block;color:var(--muted,#6b645b);font-size:.82rem;line-height:1.5}
.clg-c-list input[type=checkbox]{
  flex:0 0 auto;width:22px;height:22px;margin-top:2px;accent-color:var(--ink,#221f1b);cursor:pointer;
}
.clg-c-always{
  flex:0 0 auto;align-self:center;padding:4px 10px;border-radius:999px;
  background:#eceae6;color:var(--muted,#6b645b);font-size:.72rem;font-weight:800;white-space:nowrap;
}

/* Keep the floating chat buttons clear of the banner while it is open. */
body.has-consent-banner .float-chat{bottom:190px}
body.has-consent-banner .back-to-top{bottom:190px}

/* Desktop shows the full sentence, mobile shows the condensed one. */
.clg-c-short{display:none}
.lbl-short{display:none}

@media (max-width:720px){
  /* Compact card pinned to the bottom left corner. */
  .clg-consent{
    left:8px;right:auto;bottom:8px;
    bottom:calc(8px + env(safe-area-inset-bottom));
    width:min(52vw,168px);
    padding:8px 9px;
    border:1px solid var(--line,#ded8d1);
    border-radius:12px;
    max-height:none;overflow:visible;
    box-shadow:0 8px 20px rgba(34,28,22,.18);
    font-size:.68rem;
  }
  .clg-consent-inner{flex-direction:column;align-items:stretch;gap:6px}
  /* In a column, flex-basis applies to HEIGHT. Without this reset the
     desktop "flex:1 1 420px" stretches the text block to 420px tall and
     the card fills the screen. */
  .clg-consent-text{flex:0 0 auto}
  .clg-consent-actions{flex:0 0 auto;width:100%;gap:5px}

  /* Compact but visible heading. It was screen-reader-only before, which
     meant the card never actually said "Cookies" on a phone. */
  .clg-consent-text h2{
    margin:0 0 .22em;font-size:.88rem;line-height:1.2;font-weight:800;
    color:var(--ink,#221f1b);
  }
  .clg-c-long{display:none}
  .clg-c-short{display:block;margin:0;font-size:.56rem;line-height:1.32;color:var(--muted,#6b645b)}
  .clg-c-short a{color:var(--coral-dark,#c33d2f);text-decoration:underline}

  /* Short labels so both buttons still fit side by side at this width. */
  .lbl-long{display:none}
  .lbl-short{display:inline}

  /* Accept and Reject share one row at equal width, so rejecting stays
     exactly as easy as accepting. */
  .clg-consent-actions .btn{
    flex:1 1 0;min-width:0;min-height:29px;padding:.2em .4em;
    font-size:.67rem;justify-content:center;border-radius:999px;box-shadow:none;
  }
  .clg-c-link{flex:1 1 100%;order:3;text-align:center;padding:0;font-size:.63rem}

  /* Widen only while the toggles are open, then restore readable type. */
  .clg-consent.is-open{width:min(92vw,330px);padding:12px 13px;font-size:.78rem}
  .clg-consent.is-open .lbl-long{display:inline}
  .clg-consent.is-open .lbl-short{display:none}
  .clg-consent.is-open .clg-consent-text h2{font-size:.92rem;margin-bottom:.28em}
  .clg-consent.is-open .clg-c-short{font-size:.72rem;line-height:1.4}
  .clg-consent.is-open .clg-consent-actions .btn{min-height:36px;font-size:.78rem;padding:.4em .8em}
  .clg-consent-detail{max-height:48vh;margin-top:9px;padding-top:9px}
  .clg-c-list li > label,
  .clg-c-list li > div:first-child{padding:9px 10px;gap:10px}
  .clg-c-list b{font-size:.78rem}
  .clg-c-list span{font-size:.7rem;line-height:1.4}
  .clg-c-list input[type=checkbox]{width:19px;height:19px}

  /* Chat buttons sit bottom right, so they no longer clash. Back to top
     shares the left corner, so keep it out of the way while the card is up. */
  body.has-consent-banner .float-chat{bottom:14px;opacity:1;pointer-events:auto}
  body.has-consent-banner .back-to-top{opacity:0;visibility:hidden;pointer-events:none}
}

/* Footer address and hours: plain text, styled to match the footer links
   they replaced (they were dead anchors with inline styles before). */
.site-footer .foot-address,
.site-footer .foot-hours{
  display:block;margin:0;padding:0;
  color:var(--muted-2,#8b837a);font-style:normal;font-size:inherit;line-height:inherit;
}