/* Shared cart: drawer, "added to cart" popup, floating checkout reminder.
   Used by index.html and thanksgiving.html (both define the color variables). */

.dc-hidden{display:none !important;}

/* nav cart button + badge */
.dc-cart-btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:50%;flex-shrink:0;cursor:pointer;
  background:rgba(248,240,227,.1);border:1px solid rgba(248,240,227,.3);color:var(--cream);
  transition:background .2s ease;
}
.dc-cart-btn:hover{background:rgba(248,240,227,.2);}
.dc-badge{
  position:absolute;top:-5px;right:-5px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;
  background:var(--gold);color:#1c1510;font-size:.72rem;font-weight:800;line-height:20px;text-align:center;
}
.dc-badge[data-count="0"]{display:none;}

/* floating checkout reminder */
.dc-float{
  position:fixed;left:20px;bottom:26px;z-index:95;
  display:flex;align-items:center;gap:10px;padding:14px 22px;border-radius:100px;border:none;cursor:pointer;
  background:var(--gold);color:#1c1510;font-family:inherit;font-weight:800;font-size:.9rem;letter-spacing:.03em;text-transform:uppercase;
  box-shadow:0 10px 26px rgba(0,0,0,.45);
  transition:transform .25s ease, opacity .25s ease;
}
.dc-float:hover{transform:translateY(-2px);}
.dc-float .dc-float-total{font-weight:700;opacity:.8;text-transform:none;}
@media(max-width:600px){.dc-float{left:14px;bottom:20px;padding:13px 18px;font-size:.82rem;}}
/* room so the reminder never covers the last buttons on the page */
body.dc-has-items > footer{padding-bottom:110px;}

/* overlay + drawer */
.dc-overlay{position:fixed;inset:0;z-index:179;background:rgba(8,13,20,.7);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .3s ease;}
.dc-overlay.open{opacity:1;pointer-events:auto;}
.dc-drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:180;width:min(460px,100vw);
  background:linear-gradient(165deg, var(--navy), var(--charcoal-2) 75%);
  border-left:1px solid rgba(248,240,227,.14);box-shadow:-20px 0 60px rgba(0,0,0,.5);
  display:flex;flex-direction:column;color:var(--cream);font-family:'Inter',sans-serif;line-height:1.5;
  transform:translateX(100%);transition:transform .35s ease;
}
.dc-drawer.open{transform:translateX(0);}
.dc-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid rgba(248,240,227,.12);}
.dc-head h3{font-family:'Anton',sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.5px;font-size:1.4rem;}
.dc-x{width:38px;height:38px;border-radius:50%;background:rgba(248,240,227,.08);border:1px solid rgba(248,240,227,.18);color:var(--cream);cursor:pointer;display:flex;align-items:center;justify-content:center;}
.dc-body{flex:1;overflow-y:auto;padding:18px 22px 26px;-webkit-overflow-scrolling:touch;}
.dc-foot{padding:16px 22px 20px;border-top:1px solid rgba(248,240,227,.12);background:rgba(10,14,30,.4);}

.dc-empty{text-align:center;padding:40px 10px;color:var(--cream-dim);}
.dc-empty p{margin-bottom:20px;}
.dc-empty .dc-actions{justify-content:center;}

.dc-item{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid rgba(248,240,227,.08);}
.dc-item img{width:56px;height:56px;border-radius:10px;object-fit:cover;}
.dc-item-name{font-weight:700;font-size:.92rem;}
.dc-item-detail{font-size:.78rem;color:var(--cream-dim);}
.dc-item-price{font-weight:700;color:var(--gold);white-space:nowrap;text-align:right;}
.dc-item-controls{display:flex;align-items:center;gap:10px;margin-top:6px;}
.dc-stepper{display:inline-flex;align-items:center;border:1px solid rgba(248,240,227,.22);border-radius:100px;overflow:hidden;}
.dc-stepper button{width:30px;height:28px;background:rgba(248,240,227,.06);border:none;color:var(--cream);font-size:1rem;cursor:pointer;}
.dc-stepper button:hover{background:rgba(248,240,227,.16);}
.dc-stepper span{min-width:28px;text-align:center;font-weight:700;font-size:.88rem;}
.dc-remove{background:none;border:none;color:var(--cream-dim);font-size:.78rem;text-decoration:underline;cursor:pointer;padding:0;font-family:inherit;}
.dc-remove:hover{color:var(--ember-2);}

.dc-section{margin-top:22px;}
.dc-section h4{font-family:'Fraunces',serif;font-style:italic;font-weight:600;font-size:1.05rem;color:var(--gold);margin-bottom:10px;}
.dc-hint{font-size:.8rem;color:var(--cream-dim);margin-top:6px;}
.dc-warn{font-size:.85rem;color:#ffb38a;background:rgba(226,106,44,.12);border:1px solid rgba(226,106,44,.4);border-radius:12px;padding:10px 12px;margin-top:10px;}
.dc-radio{display:flex;align-items:flex-start;gap:10px;padding:11px 12px;border-radius:12px;border:1px solid rgba(248,240,227,.14);background:rgba(248,240,227,.04);margin-bottom:8px;cursor:pointer;font-size:.9rem;color:var(--cream-dim);}
.dc-radio:has(input:checked){border-color:var(--gold);background:rgba(217,162,86,.1);color:var(--cream);}
.dc-radio input{accent-color:var(--ember-2);width:16px;height:16px;margin-top:2px;flex-shrink:0;}
.dc-radio b{color:var(--cream);font-weight:700;}
.dc-radio small{display:block;color:var(--cream-dim);font-size:.78rem;}

.dc-field{margin-bottom:10px;}
.dc-field label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--cream-dim);margin-bottom:5px;}
.dc-field input, .dc-field textarea{
  width:100%;padding:11px 13px;border-radius:10px;background:rgba(248,240,227,.06);border:1px solid rgba(248,240,227,.18);
  color:var(--cream);font-family:inherit;font-size:16px;
}
.dc-field input:focus, .dc-field textarea:focus{outline:none;border-color:var(--ember-2);background:rgba(248,240,227,.1);}
.dc-field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media(max-width:420px){.dc-field-row{grid-template-columns:1fr;}}

.dc-sum{display:grid;gap:4px;font-size:.9rem;color:var(--cream-dim);margin-bottom:12px;}
.dc-sum div{display:flex;justify-content:space-between;gap:10px;}
.dc-sum .dc-total{font-size:1.1rem;font-weight:800;color:var(--gold);padding-top:6px;margin-top:4px;border-top:1px solid rgba(248,240,227,.12);}
.dc-actions{display:flex;gap:10px;flex-wrap:wrap;}
.dc-btn{
  flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 18px;border-radius:100px;
  font-family:inherit;font-weight:800;font-size:.85rem;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;border:none;text-align:center;line-height:1.2;text-decoration:none;
}
.dc-btn-primary{background:linear-gradient(135deg,var(--ember-2),var(--ember-dark));color:#fff;box-shadow:0 6px 16px rgba(0,0,0,.3);}
.dc-btn-gold{background:var(--gold);color:#1c1510;}
.dc-btn-ghost{background:rgba(248,240,227,.08);color:var(--cream);border:1px solid rgba(248,240,227,.3);}
.dc-btn:disabled{opacity:.55;cursor:not-allowed;}
.dc-msg{font-size:.82rem;margin-top:10px;color:var(--cream-dim);min-height:1em;}
.dc-msg.err{color:#ffb38a;}

/* "added to cart" popup */
.dc-toast{
  position:fixed;top:78px;right:20px;z-index:170;width:min(360px,calc(100vw - 28px));
  background:linear-gradient(165deg, var(--navy), var(--charcoal-2));border:1px solid rgba(248,240,227,.18);border-radius:18px;
  padding:16px;box-shadow:0 24px 60px rgba(0,0,0,.55);color:var(--cream);font-family:'Inter',sans-serif;
  opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .25s ease, transform .25s ease;
}
.dc-toast.show{opacity:1;transform:translateY(0);pointer-events:auto;}
.dc-toast-top{display:flex;gap:12px;align-items:center;margin-bottom:14px;}
.dc-toast-top img{width:52px;height:52px;border-radius:10px;object-fit:cover;}
.dc-toast-title{display:flex;align-items:center;gap:6px;font-weight:800;color:var(--gold);font-size:.95rem;}
.dc-toast-item{font-size:.85rem;color:var(--cream-dim);}
.dc-toast-sub{font-size:.82rem;color:var(--cream-dim);margin-top:2px;}
@media(max-width:600px){
  .dc-toast{top:auto;bottom:14px;right:14px;left:14px;width:auto;transform:translateY(12px);}
  .dc-toast.show{transform:translateY(0);}
}


.dc-fine{font-size:.72rem;line-height:1.5;color:var(--cream-dim);opacity:.85;margin-top:10px;}
.dc-fine a{text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere;}
.dc-fine a:hover{color:var(--gold);}
