:root {
  --dca-ink: #10221e;
  --dca-green: #972828;
  --dca-green-2: #972828;
  --dca-bg: #f4f6f3;
  --dca-line: #d7e3db;
  --dca-muted: #63716b;
  --dca-accent: #972828;
  --dca-red: #de1832;
}

html:has(body.dca-app-page),
body.dca-app-page {
  width: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
  background: var(--dca-bg);
}
body.dca-app-page #wpadminbar { display: none; }
body.dca-app-page { margin-top: 0 !important; }

.dca-lista-root,
.dca-lista-root * { box-sizing: border-box; }
.dca-lista-root { color: var(--dca-ink); font: 16px/1.45 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.dca-lista-root button,
.dca-lista-root input,
.dca-lista-root select { font: inherit; }
.dca-lista-root button { cursor: pointer; }
.dca-lista-root button:disabled { cursor: not-allowed; }
.dca-lista-root img { max-width: 100%; }
.dca-lista-app { min-height: 100vh; overflow-x: hidden; background: var(--dca-bg); padding: .75rem; }
.dca-shell { width: 100%; max-width: 430px; margin: 0 auto; }
.dca-loading { min-height: 18rem; display: grid; place-items: center; color: var(--dca-muted); font-weight: 700; }

.dca-pin-screen { display: grid; min-height: 100vh; place-items: center; overflow: hidden; padding: 1rem; background: radial-gradient(circle at top right, #fde9e8 0, transparent 33rem), var(--dca-bg); }
.dca-pin-card { width: 100%; max-width: 26rem; border: 1px solid #f1d7dc; border-radius: 1.5rem; padding: 1.5rem; background: #fff; box-shadow: 0 24px 75px rgba(18,59,50,.14); }
.dca-pin-logos { display: flex; align-items: center; gap: .75rem; }
.dca-pin-logos img:first-child { width: 3.5rem; height: 2.5rem; object-fit: contain; }
.dca-pin-logos img:last-child { width: 6.5rem; height: 2.5rem; object-fit: contain; }
.dca-pin-logos span { width: 1px; height: 2.1rem; background: #e5d5d8; }
.dca-pin-kicker { margin: 1.5rem 0 0; color: #b51248; font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.dca-pin-card h1 { margin: .25rem 0 0; font-size: 1.75rem; }
.dca-pin-copy { margin: .55rem 0 0; color: var(--dca-muted); font-size: .9rem; line-height: 1.55; }
.dca-pin-form { display: grid; gap: .6rem; margin-top: 1.35rem; }
.dca-pin-form label { color: #253b34; font-size: .85rem; font-weight: 800; }
.dca-pin-form .dca-input, .dca-pin-form input { min-height: 3rem; border: 1px solid #cbd9d0; border-radius: .75rem; padding: .7rem .8rem; outline: none; background: #fbfdfb; color: var(--dca-ink); font: inherit; }
.dca-pin-form input:focus { border-color: var(--dca-green-2); box-shadow: 0 0 0 3px rgba(21,116,90,.13); }
.dca-pin-form .dca-button { width: 100%; margin-top: .25rem; }
.dca-pin-message { min-height: 1.25rem; margin: 0; color: #b42318; font-size: .82rem; font-weight: 700; }

.dca-header { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 1.25rem; padding: 1rem; border: 1px solid #f1d7dc; border-radius: 1.5rem; background: #fff; box-shadow: 0 18px 50px rgba(115, 18, 40, .08); }
.dca-brand { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.dca-brand img:first-child { width: 3.5rem; height: 2.25rem; object-fit: contain; }
.dca-brand img:nth-of-type(2) { width: 6rem; height: 2.25rem; object-fit: contain; }
.dca-brand-divider { width: 1px; height: 2.25rem; flex: 0 0 auto; background: #e5d5d8; }
.dca-brand-copy { flex-basis: 100%; border-top: 1px solid #e5d5d8; padding-top: .75rem; }
.dca-brand-copy p { margin: 0; color: #b51248; font-size: .7rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.dca-brand-copy h1 { margin: .2rem 0 0; color: #1f242e; font-size: 1.35rem; line-height: 1.15; }
.dca-header-actions { display: flex; align-items: center; gap: .75rem; }
.dca-total-head { min-width: 0; flex: 1; border-radius: .8rem; background: #e8f2eb; padding: .55rem .75rem; }
.dca-total-head span { display: block; color: #597168; font-size: .72rem; font-weight: 700; }
.dca-total-head strong { display: block; color: var(--dca-green); font-size: 1.05rem; white-space: nowrap; }

.dca-button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 2.7rem; border: 1px solid transparent; border-radius: .8rem; padding: .6rem .85rem; background: var(--dca-green); color: #fff; font-size: .9rem; font-weight: 800; text-decoration: none; transition: .18s ease; }
.dca-button:hover { background: #0e3029; color: #fff; }
.dca-button--accent { flex: 0 0 auto; background: var(--dca-accent); }
.dca-button--accent:hover { background: #cb5b2b; }
.dca-button--outline { min-height: 2.25rem; border-color: #cbd9d0; background: #fff; color: #496158; }
.dca-button--outline:hover { background: #edf3ef; color: #123b32; }
.dca-button--category { min-height: 2.1rem; border-radius: 999px; padding: .4rem .7rem; font-size: .78rem; }
.dca-button--category.is-active { border-color: var(--dca-green); background: var(--dca-green); color: #fff; }
.dca-button--text { width: 100%; justify-content: space-between; background: transparent; color: #dceae3; }
.dca-button--text:hover { background: rgba(255,255,255,.1); }
.dca-icon-button { display: inline-grid; width: 2rem; height: 2rem; place-items: center; border: 0; border-radius: .55rem; background: transparent; color: #597168; font-size: 1.05rem; }
.dca-icon-button:hover { background: #edf3ef; color: var(--dca-green); }
.dca-icon-button--danger:hover { background: #fff0ee; color: #b42318; }

.dca-layout { display: grid; gap: 1.25rem; }
.dca-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; padding: 0 .25rem; margin-bottom: 1rem; }
.dca-section-heading h2 { margin: 0; font-size: 1.1rem; }
.dca-section-heading p { margin: .15rem 0 0; color: var(--dca-muted); font-size: .86rem; }
.dca-count { flex: 0 0 auto; border-radius: 999px; background: #fff; padding: .35rem .65rem; color: #597168; font-size: .8rem; font-weight: 800; }
.dca-toolbar { display: grid; gap: .75rem; margin-bottom: 1rem; }
.dca-search { position: relative; }
.dca-search svg { position: absolute; top: 50%; left: .8rem; width: 1rem; height: 1rem; transform: translateY(-50%); color: #6e8379; pointer-events: none; }
.dca-input { display: block; width: 100%; min-width: 0; min-height: 2.7rem; border: 1px solid #cbd9d0; border-radius: .7rem; padding: .6rem .75rem; outline: none; background: #fbfdfb; color: var(--dca-ink); }
.dca-input:focus { border-color: var(--dca-green-2); box-shadow: 0 0 0 3px rgba(21,116,90,.13); }
.dca-search .dca-input { border-color: var(--dca-line); background: #fff; padding-left: 2.35rem; box-shadow: 0 2px 5px rgba(29,60,50,.04); }
.dca-categories { display: flex; flex-wrap: wrap; gap: .5rem; }
.dca-product-list { overflow: hidden; border: 1px solid var(--dca-line); border-radius: 1.5rem; background: #fff; box-shadow: 0 18px 50px rgba(29,60,50,.05); }
.dca-product-card { display: grid; grid-template-columns: auto 4rem minmax(0, 1fr); align-items: start; gap: .75rem; padding: 1rem; }
.dca-product-card + .dca-product-card { border-top: 1px solid #e7eee9; }
.dca-check { width: 1.2rem; height: 1.2rem; margin: .2rem 0 0; accent-color: var(--dca-green-2); }
.dca-image { display: grid; width: 4rem; aspect-ratio: 1; place-items: center; overflow: hidden; border-radius: .75rem; background: #edf3ef; color: #527268; font-size: 1.35rem; }
.dca-image img { width: 100%; height: 100%; object-fit: cover; }
.dca-product-content { min-width: 0; }
.dca-product-title-row { display: flex; align-items: start; justify-content: space-between; gap: .5rem; }
.dca-product-title { min-width: 0; }
.dca-product-title h3 { overflow: hidden; margin: 0; font-size: 1rem; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.dca-product-title p { overflow: hidden; margin: .2rem 0 0; color: var(--dca-muted); font-size: .82rem; text-overflow: ellipsis; white-space: nowrap; }
.dca-mobile-actions { display: flex; flex: 0 0 auto; gap: .15rem; }
.dca-desktop-actions { display: none; }
.dca-offers { display: grid; grid-template-columns: minmax(0, 1fr); gap: .5rem; margin-top: .75rem; }
.dca-offer { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 2.6rem; gap: .7rem; border: 1px solid #cbd9d0; border-radius: .7rem; padding: .55rem .65rem; background: #fff; color: #30483e; text-align: left; }
.dca-offer:not(:disabled):hover { background: #edf3ef; }
.dca-offer.is-chosen { border-color: var(--dca-green-2); background: #e7f4eb; color: var(--dca-green); }
.dca-offer.is-unavailable { border-color: #e2e6e3; background: #f5f6f5; color: #919b96; }
.dca-offer span { min-width: 0; overflow: hidden; font-size: .78rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.dca-offer strong { flex: 0 0 auto; font-size: .78rem; white-space: nowrap; }
.dca-lowest { color: var(--dca-red); }
.dca-empty { display: grid; min-height: 16rem; place-items: center; padding: 2rem; text-align: center; }
.dca-empty h3 { margin: .6rem 0 0; }
.dca-empty p { margin: .35rem 0 0; color: var(--dca-muted); font-size: .9rem; }

.dca-summary { overflow: hidden; border-radius: 1.5rem; background: var(--dca-green); color: #fff; box-shadow: 0 18px 50px rgba(18,59,50,.22); }
.dca-summary-head { border-bottom: 1px solid rgba(255,255,255,.15); padding: 1rem; }
.dca-summary-kicker { margin: 0; color: #bbd7c7; font-size: .7rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.dca-summary h2 { margin: .1rem 0 0; font-size: 1.1rem; }
.dca-summary-total { margin: 1rem 0 0; font-size: 2rem; line-height: 1; }
.dca-summary-hint { margin: .35rem 0 0; color: #d3e3da; font-size: .85rem; }
.dca-summary-lines { display: grid; gap: .65rem; padding: 1rem; }
.dca-summary-line { display: flex; align-items: center; justify-content: space-between; gap: .75rem; font-size: .85rem; }
.dca-summary-line span { min-width: 0; }
.dca-summary-line span span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dca-summary-line small { color: #b8d1c3; }
.dca-summary-line strong { flex: 0 0 auto; white-space: nowrap; }
.dca-summary-stores { display: grid; gap: .65rem; border-top: 1px solid rgba(255,255,255,.1); padding-top: .85rem; }
.dca-summary-store { display: flex; align-items: center; justify-content: space-between; gap: .75rem; color: #dceae3; font-size: .82rem; }
.dca-summary-store strong { flex: 0 0 auto; color: #fff; }
.dca-summary-footer { border-top: 1px solid rgba(255,255,255,.15); padding: .75rem 1rem; }
.dca-notice { display: flex; gap: .5rem; align-items: center; margin-bottom: 1rem; border: 1px solid #cde1d3; border-radius: .75rem; padding: .7rem .85rem; background: #eef8f1; color: #215843; font-size: .88rem; font-weight: 700; }
.dca-notice.is-error { border-color: #f0c7c1; background: #fff1ef; color: #a2362b; }
.dca-quantity { display: flex; align-items: center; gap: .65rem; margin-top: .7rem; color: var(--dca-muted); font-size: .8rem; font-weight: 800; }
.dca-quantity-control { display: inline-flex; align-items: center; overflow: hidden; border: 1px solid var(--dca-line); border-radius: .7rem; background: #fff; }
.dca-quantity-control strong { min-width: 2.25rem; text-align: center; color: var(--dca-ink); }
.dca-quantity-button { width: 2.25rem; height: 2.25rem; border: 0; background: #f4f6f3; color: var(--dca-accent); font: inherit; font-size: 1.15rem; font-weight: 900; cursor: pointer; }
.dca-quantity-button:hover { background: #f7e4e4; }
.dca-quantity-button:disabled { opacity: .35; cursor: not-allowed; }
.dca-pagination { display: flex; justify-content: center; align-items: center; gap: .4rem; flex-wrap: wrap; margin-top: 1rem; }
.dca-page-button { min-width: 2.5rem; height: 2.5rem; padding: 0 .65rem; border: 1px solid var(--dca-line); border-radius: .75rem; background: #fff; color: var(--dca-ink); font: inherit; font-weight: 800; cursor: pointer; }
.dca-page-button:hover, .dca-page-button.is-active { border-color: var(--dca-accent); background: var(--dca-accent); color: #fff; }
.dca-page-button:disabled { opacity: .35; cursor: not-allowed; }

.dca-modal { position: fixed; z-index: 99999; inset: 0; display: grid; place-items: center; padding: .5rem; background: rgba(16,34,30,.45); }
.dca-modal-card { width: calc(100% - 1rem); max-width: 42rem; max-height: calc(100dvh - 1rem); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; border-radius: 1.15rem; background: #fff; padding: 1.25rem; box-shadow: 0 20px 65px rgba(16,34,30,.26); }
.dca-modal-head { display: flex; justify-content: space-between; gap: .75rem; }
.dca-modal-head h2 { margin: 0; font-size: 1.25rem; }
.dca-modal-head p { margin: .35rem 0 0; color: var(--dca-muted); font-size: .85rem; }
.dca-form { display: grid; gap: 1rem; margin-top: 1rem; }
.dca-field { display: grid; gap: .4rem; }
.dca-field > label, .dca-offer-heading h3 { color: #253b34; font-size: .9rem; font-weight: 800; }
.dca-image-field { display: flex; align-items: center; gap: .75rem; border: 1px dashed #b9cebf; border-radius: .75rem; padding: .75rem; background: #f7faf8; }
.dca-image-field input { max-width: 100%; font-size: .8rem; }
.dca-offer-heading { display: flex; align-items: start; justify-content: space-between; gap: .75rem; }
.dca-offer-heading h3 { margin: 0; }
.dca-offer-heading p { margin: .25rem 0 0; color: var(--dca-muted); font-size: .76rem; }
.dca-add-store { min-height: 2.25rem; flex: 0 0 auto; }
.dca-offer-fields { display: grid; gap: .7rem; }
.dca-offer-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; }
.dca-offer-field .dca-input:first-child { grid-column: 1 / -1; }
.dca-offer-field .dca-icon-button { width: 2.7rem; height: 2.7rem; border: 1px solid #ead1ce; }
.dca-modal-footer { display: flex; flex-direction: column-reverse; gap: .6rem; margin-top: 1.2rem; }
.dca-modal-footer .dca-button { width: 100%; }

@media (max-width: 640px) {
  .dca-modal { align-items: end; padding: 0; }
  .dca-modal-card { width: 100%; max-width: none; max-height: calc(100dvh - .25rem); border-radius: 1.25rem 1.25rem 0 0; padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom)); }
  .dca-modal-head { position: sticky; z-index: 2; top: -1rem; margin: -1rem -1rem 0; border-bottom: 1px solid #e7eee9; padding: 1rem; background: #fff; }
  .dca-modal-head h2 { font-size: 1.15rem; }
  .dca-modal-head p { max-width: 17rem; }
  .dca-form { gap: .85rem; }
  .dca-input { min-height: 2.85rem; }
  .dca-image-field { align-items: flex-start; flex-direction: column; }
  .dca-offer-heading { flex-direction: column; align-items: stretch; }
  .dca-offer-heading > div { min-width: 0; }
  .dca-add-store { width: 100%; }
  .dca-offer-fields { gap: .6rem; }
  .dca-offer-field { display: flex; flex-wrap: wrap; gap: .5rem; border: 1px solid #e1e9e4; border-radius: .85rem; padding: .6rem; background: #f9fcfa; }
  .dca-offer-field .dca-input:first-child { flex: 0 0 100%; }
  .dca-offer-field .dca-input:not(:first-child) { width: auto; min-width: 0; flex: 1 1 0; }
  .dca-offer-field .dca-icon-button { flex: 0 0 2.7rem; }
  .dca-quantity { justify-content: space-between; }
  .dca-modal-footer { position: sticky; z-index: 2; bottom: calc(-1rem - env(safe-area-inset-bottom)); margin: 0 -1rem calc(-1rem - env(safe-area-inset-bottom)); border-top: 1px solid #e7eee9; padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); background: #fff; }
}

@media (min-width: 641px) {
  .dca-app { padding: 1.25rem; }
  .dca-shell { max-width: 75rem; }
  .dca-header { flex-direction: row; align-items: center; justify-content: space-between; padding: 1.25rem 1.75rem; }
  .dca-brand { flex-wrap: nowrap; gap: 1rem; }
  .dca-brand img:first-child { width: 4rem; height: 3rem; }
  .dca-brand img:nth-of-type(2) { width: 8rem; height: 3rem; }
  .dca-brand-copy { flex-basis: auto; border-top: 0; border-left: 1px solid #e5d5d8; padding: 0 0 0 1rem; }
  .dca-brand-copy h1 { font-size: 1.75rem; }
  .dca-product-card { grid-template-columns: auto 5rem minmax(0,1fr) auto; align-items: center; gap: 1.25rem; padding: 1.25rem; }
  .dca-image { width: 5rem; }
  .dca-mobile-actions { display: none; }
  .dca-desktop-actions { display: flex; gap: .15rem; }
  .dca-offers { display: flex; flex-wrap: wrap; }
  .dca-offer { width: auto; justify-content: flex-start; }
  .dca-offer-fields { gap: .5rem; }
  .dca-offer-field { grid-template-columns: minmax(0, 1fr) 7.5rem auto; }
  .dca-offer-field .dca-input:first-child { grid-column: auto; }
  .dca-modal-footer { flex-direction: row; justify-content: flex-end; }
  .dca-modal-footer .dca-button { width: auto; }
}

@media (min-width: 768px) {
  .dca-layout { grid-template-columns: minmax(0, 1fr) 19rem; align-items: start; }
  .dca-summary { position: sticky; top: 1.25rem; }
}

@media (min-width: 1100px) {
  .dca-shell { max-width: 80rem; }
  .dca-layout { grid-template-columns: minmax(0, 1fr) 22rem; gap: 1.5rem; }
}