/* =========================================================
   ЧАЇ КАРПАТ — mobile-first WordPress theme
   Усі класи мають префікс ckp- для уникнення конфліктів.
   ========================================================= */

#ckp-app, #ckp-app * { box-sizing: border-box !important; }
#ckp-app {
  --ckp-green:#234c34;
  --ckp-green-2:#356747;
  --ckp-green-3:#edf4ee;
  --ckp-cream:#f8f3e8;
  --ckp-card:#fffdf8;
  --ckp-ink:#1e2b22;
  --ckp-muted:#66736a;
  --ckp-gold:#d7a83f;
  --ckp-line:#e4dfd3;
  --ckp-danger:#a84b39;
  width:100%;
  max-width:none;
  margin:0;
  padding:0 0 92px;
  overflow-x:hidden;
  background:var(--ckp-cream);
  color:var(--ckp-ink);
  font-family:Arial, Helvetica, sans-serif;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
}

#ckp-app h1,#ckp-app h2,#ckp-app h3,#ckp-app p { margin:0; padding:0; }
#ckp-app button { font:inherit; }
#ckp-app img { display:block; max-width:100%; }
#ckp-app a { color:inherit; text-decoration:none; }

.ckp-shell { width:100%; max-width:640px; margin:0 auto; }

/* Hero */
.ckp-hero {
  position:relative;
  padding:28px 16px 24px;
  background:
    radial-gradient(circle at 88% 12%, rgba(215,168,63,.18), transparent 28%),
    linear-gradient(145deg,#1f432f,#315f42);
  color:#fff;
  overflow:hidden;
}
.ckp-hero:after {
  content:"";
  position:absolute;
  right:-54px;
  bottom:-70px;
  width:180px;
  height:180px;
  border:34px solid rgba(255,255,255,.05);
  border-radius:50%;
}
.ckp-brand {
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
  font-weight:800;
  letter-spacing:.08em;
  font-size:14px;
}
.ckp-brand-mark {
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  font-size:18px;
}
.ckp-kicker {
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 10px;
  margin-bottom:12px;
  border-radius:999px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.12);
  font-size:12px;
  font-weight:700;
}
.ckp-hero h1 {
  max-width:540px;
  color:#fff;
  font-size:34px;
  line-height:1.03;
  font-weight:900;
  letter-spacing:-.035em;
}
.ckp-hero p {
  margin-top:12px;
  color:rgba(255,255,255,.88);
  font-size:16px;
  max-width:500px;
}
.ckp-hero-meta {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:16px;
}
.ckp-pill {
  padding:8px 10px;
  border-radius:12px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.11);
  color:#fff;
  font-size:13px;
  font-weight:700;
}
.ckp-primary-btn {
  width:100%;
  border:0;
  border-radius:15px;
  margin-top:18px;
  padding:15px 18px;
  background:var(--ckp-gold);
  color:#17251b;
  font-size:16px;
  font-weight:900;
  box-shadow:0 9px 24px rgba(0,0,0,.18);
  cursor:pointer;
}

/* quick categories */
.ckp-quick {
  padding:16px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  background:#fff;
  border-bottom:1px solid var(--ckp-line);
}
.ckp-quick button {
  min-height:46px;
  border:1px solid #dfe7e1;
  border-radius:13px;
  background:#f7faf7;
  color:var(--ckp-green);
  font-size:13px;
  font-weight:800;
  cursor:pointer;
}

/* section */
.ckp-section { padding:25px 16px 6px; }
.ckp-section-title {
  font-size:26px;
  line-height:1.08;
  font-weight:900;
  letter-spacing:-.02em;
  color:var(--ckp-ink);
}
.ckp-section-sub {
  margin-top:8px;
  color:var(--ckp-muted);
  font-size:14px;
}

/* products */
.ckp-products { display:flex; flex-direction:column; gap:14px; padding:14px 16px 22px; }
.ckp-product {
  background:var(--ckp-card);
  border:1px solid var(--ckp-line);
  border-radius:20px;
  padding:14px;
  box-shadow:0 9px 25px rgba(28,49,35,.07);
}
.ckp-product-media {
  position:relative;
  min-height:250px;
  border-radius:16px;
  background:linear-gradient(180deg,#f2f0e9,#ebe7dc);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  overflow:hidden;
}
.ckp-product-media img {
  width:auto;
  height:230px;
  object-fit:contain;
  filter:drop-shadow(0 12px 16px rgba(0,0,0,.14));
}
.ckp-badge {
  position:absolute;
  top:11px;
  left:11px;
  padding:7px 9px;
  border-radius:999px;
  background:var(--ckp-green);
  color:#fff;
  font-size:11px;
  font-weight:900;
  z-index:2;
}
.ckp-product-body { padding:15px 2px 2px; }
.ckp-product h3 {
  font-size:22px;
  line-height:1.12;
  font-weight:900;
  letter-spacing:-.015em;
  color:var(--ckp-ink);
}
.ckp-product-desc {
  margin-top:9px;
  color:var(--ckp-muted);
  font-size:14px;
}
.ckp-price-row {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-top:15px;
  padding-top:13px;
  border-top:1px solid var(--ckp-line);
}
.ckp-price-wrap { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.ckp-old-price { color:#8c918d; text-decoration:line-through; font-size:14px; }
.ckp-price { color:var(--ckp-green); font-size:28px; line-height:1; font-weight:900; }
.ckp-pack { color:var(--ckp-muted); font-size:12px; text-align:right; }
.ckp-add {
  width:100%;
  margin-top:12px;
  border:0;
  border-radius:14px;
  min-height:50px;
  background:var(--ckp-green);
  color:#fff;
  font-size:15px;
  font-weight:900;
  cursor:pointer;
}
.ckp-add.is-added { background:#e8f2ea; color:var(--ckp-green); border:1px solid #cbdccd; }
.ckp-small-note { margin-top:10px; color:#879087; font-size:11px; }

/* Benefits / order */
.ckp-info-box {
  margin:0 16px 14px;
  border-radius:20px;
  padding:18px;
  background:#fff;
  border:1px solid var(--ckp-line);
}
.ckp-info-box h2 { font-size:23px; font-weight:900; color:var(--ckp-ink); }
.ckp-steps { display:grid; gap:11px; margin-top:15px; }
.ckp-step { display:flex; gap:11px; align-items:flex-start; }
.ckp-step-num {
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--ckp-green);
  color:#fff;
  font-weight:900;
}
.ckp-step strong { display:block; font-size:14px; }
.ckp-step span { display:block; margin-top:2px; color:var(--ckp-muted); font-size:13px; }

/* FAQ */
.ckp-faq { padding:3px 16px 18px; }
.ckp-faq-item { border-bottom:1px solid var(--ckp-line); }
.ckp-faq-q {
  width:100%;
  padding:15px 0;
  border:0;
  background:transparent;
  display:flex;
  justify-content:space-between;
  gap:12px;
  text-align:left;
  color:var(--ckp-ink);
  font-weight:900;
  font-size:15px;
  cursor:pointer;
}
.ckp-faq-a { display:none; padding:0 0 15px; color:var(--ckp-muted); font-size:13px; }
.ckp-faq-item.is-open .ckp-faq-a { display:block; }

/* Order / lead form */
.ckp-order {
  margin:4px 16px 18px;
  padding:22px 16px;
  border-radius:20px;
  background:#fff;
  border:1px solid var(--ckp-line);
}
.ckp-order h3 { font-size:21px; color:var(--ckp-green); font-weight:900; }
.ckp-order-summary { margin-top:10px; padding:10px 12px; border-radius:12px; background:var(--ckp-green-3); font-size:14px; font-weight:800; color:var(--ckp-green); }
.ckp-preview-notice { margin-top:12px; padding:10px 12px; border-radius:10px; background:#fff0ce; color:#735315; border:1px solid #ebd7a8; font-size:12px; }
#ckp-lead-form { margin-top:16px; }
#ckp-lead-form label:not(.ckp-consent) { display:block; font-size:13px; font-weight:800; margin-bottom:6px; color:var(--ckp-ink); }
#ckp-lead-form input:not([type=checkbox]) { width:100%; min-height:48px; border:1px solid #dfe7e1; border-radius:12px; padding:12px; font-size:15px; margin-bottom:4px; color:var(--ckp-ink); background:#fff; }
#ckp-lead-form input[aria-invalid=true] { border-color:var(--ckp-danger); }
.ckp-field-error { display:block; min-height:8px; color:var(--ckp-danger); font-size:12px; margin-bottom:8px; }
.ckp-honeypot { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.ckp-consent { display:flex; gap:8px; align-items:flex-start; margin:6px 0 4px; font-size:12px; color:var(--ckp-muted); }
.ckp-consent input { width:18px; height:18px; flex:none; margin-top:2px; accent-color:var(--ckp-green); }
.ckp-text-btn { padding:0; border:0; background:none; color:var(--ckp-green); text-decoration:underline; font-size:12px; cursor:pointer; }
.ckp-form-note { margin-top:10px; text-align:center; font-size:11px; color:var(--ckp-muted); }
.ckp-form-status:not(:empty) { margin-top:12px; padding:10px 12px; border-radius:10px; background:#e8f2ea; font-size:13px; }
.ckp-form-status.error:not(:empty) { background:#fbe8e1; color:#8f3226; }
.ckp-muted { color:var(--ckp-muted); }

/* Sticky cart bar */
.ckp-cartbar {
  position:fixed;
  z-index:99990;
  left:0;
  right:0;
  bottom:0;
  display:none;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.95);
  backdrop-filter:blur(10px);
  border-top:1px solid #dde3de;
  box-shadow:0 -8px 28px rgba(20,38,26,.12);
}
.ckp-cartbar.is-visible { display:block; }
.ckp-cartbar-btn {
  width:100%;
  max-width:616px;
  margin:0 auto;
  min-height:54px;
  padding:0 15px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:0;
  border-radius:15px;
  background:var(--ckp-green);
  color:#fff;
  font-weight:900;
  cursor:pointer;
}
.ckp-cartbar-total { font-size:16px; }

/* Cart drawer */
.ckp-drawer {
  position:fixed;
  inset:0;
  z-index:100000;
  visibility:hidden;
  pointer-events:none;
}
.ckp-drawer.is-open { visibility:visible; pointer-events:auto; }
.ckp-overlay { position:absolute; inset:0; background:rgba(14,24,17,.52); opacity:0; transition:.22s ease; }
.ckp-drawer.is-open .ckp-overlay { opacity:1; }
.ckp-panel {
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  max-height:86vh;
  overflow:auto;
  border-radius:24px 24px 0 0;
  background:#fff;
  padding:14px 16px calc(18px + env(safe-area-inset-bottom));
  transform:translateY(102%);
  transition:.25s ease;
}
.ckp-drawer.is-open .ckp-panel { transform:translateY(0); }
.ckp-panel-head { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:4px 0 13px; }
.ckp-panel-head h2 { font-size:24px; font-weight:900; }
.ckp-close { width:40px; height:40px; border:0; border-radius:50%; background:#eef2ef; font-size:20px; cursor:pointer; }
.ckp-cart-items { display:grid; gap:10px; }
.ckp-cart-item {
  display:grid;
  grid-template-columns:58px 1fr auto;
  gap:10px;
  align-items:center;
  padding:10px;
  border:1px solid var(--ckp-line);
  border-radius:14px;
  background:#fffdfa;
}
.ckp-cart-thumb { width:58px; height:68px; object-fit:contain; border-radius:9px; background:#f2efe6; }
.ckp-cart-name { font-size:13px; font-weight:900; line-height:1.2; }
.ckp-cart-unit { margin-top:3px; font-size:12px; color:var(--ckp-muted); }
.ckp-qty { display:flex; align-items:center; gap:7px; margin-top:8px; }
.ckp-qty button { width:30px; height:30px; border:1px solid #d7ddd9; border-radius:9px; background:#fff; font-weight:900; cursor:pointer; }
.ckp-qty span { min-width:18px; text-align:center; font-weight:900; }
.ckp-remove { margin-top:6px; border:0; padding:0; background:transparent; color:var(--ckp-danger); font-size:11px; cursor:pointer; }
.ckp-cart-line-total { font-size:14px; font-weight:900; white-space:nowrap; }
.ckp-summary { margin-top:13px; padding-top:13px; border-top:1px solid var(--ckp-line); }
.ckp-summary-row { display:flex; justify-content:space-between; gap:12px; font-size:14px; }
.ckp-summary-row + .ckp-summary-row { margin-top:7px; }
.ckp-summary-row.ckp-grand { font-size:20px; font-weight:900; color:var(--ckp-green); }
.ckp-checkout { width:100%; min-height:52px; margin-top:14px; border:0; border-radius:14px; background:var(--ckp-gold); color:#18251c; font-size:16px; font-weight:900; cursor:pointer; }
.ckp-empty { padding:26px 10px; text-align:center; color:var(--ckp-muted); font-size:14px; }

.ckp-footer { padding:8px 16px 22px; text-align:center; color:#7d877f; font-size:11px; }

/* Privacy dialog */
.ckp-privacy-dialog { border:0; padding:26px 20px; border-radius:20px; color:var(--ckp-ink); background:#fff; max-width:calc(100% - 32px); width:520px; max-height:90dvh; }
.ckp-privacy-dialog h2 { font-size:1.6rem; margin:6px 0 16px; }
.ckp-privacy-dialog p { margin-top:12px; font-size:14px; color:var(--ckp-muted); }
.ckp-privacy-dialog .ckp-close { position:absolute; top:12px; right:12px; }
.ckp-privacy-dialog[open] { position:fixed; }
.ckp-privacy-dialog::backdrop { background:rgba(14,24,17,.52); }

@media (min-width:641px) {
  #ckp-app { background:#ede8dc; }
  .ckp-shell { box-shadow:0 0 50px rgba(0,0,0,.08); background:var(--ckp-cream); }
}