/* Demo orders have their own visible state; real account orders stay separate. */
#store-dialog[data-view="demo-delivery"],
#store-dialog[data-view="demo-history"]{width:min(700px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:28px;border-radius:26px;overscroll-behavior:contain;scrollbar-gutter:stable;font-size:15px;line-height:1.55}
#store-dialog[data-view="demo-delivery"] [hidden],
#store-dialog[data-view="demo-history"] [hidden]{display:none!important}
#store-dialog[data-view="demo-delivery"] .modal-head,
#store-dialog[data-view="demo-history"] .modal-head{gap:16px;padding-bottom:20px}
#store-dialog[data-view="demo-delivery"] .modal-head>div,
#store-dialog[data-view="demo-history"] .modal-head>div{min-width:0}
#store-dialog[data-view="demo-delivery"] .modal-head h2,
#store-dialog[data-view="demo-history"] .modal-head h2{font-size:28px;line-height:1.25;letter-spacing:-.7px;overflow-wrap:anywhere}
#store-dialog[data-view="demo-delivery"] .modal-head .eyebrow,
#store-dialog[data-view="demo-history"] .modal-head .eyebrow{font-size:10px;line-height:1.5;letter-spacing:1.2px;color:#617992;margin-bottom:6px}
#store-dialog[data-view="demo-delivery"] .modal-close,
#store-dialog[data-view="demo-history"] .modal-close{width:38px;height:38px;font-size:26px}
.delivery-demo-note{margin:18px 0;padding:11px 14px;border:1px solid #d8e6f9;border-radius:11px;background:#f0f6ff;color:#476589;font-size:13px;line-height:1.65;overflow-wrap:anywhere}
.delivery-demo-note strong{font-weight:600;color:#2c5797}
.delivery-success-icon{display:grid;place-items:center;width:48px;height:48px;flex:0 0 48px;margin:18px 0 14px;border:1px solid #cfe9df;border-radius:16px;background:#edf9f4;color:#25876b}
.delivery-success-icon svg{width:27px;height:27px;stroke-width:2}
.delivery-summary{display:flex;align-items:center;gap:14px;min-width:0;margin:18px 0;padding:17px 18px;border:1px solid #e1e9f3;border-radius:16px;background:linear-gradient(120deg,#f8fbff,#f1f7fc)}
.delivery-summary>img{width:50px;height:50px;flex:0 0 50px;padding:9px;object-fit:contain;border:1px solid #e5ebf3;border-radius:14px;background:#fff}
.delivery-summary>div{flex:1 1 auto;min-width:0}
.delivery-summary h3{font-size:20px;line-height:1.35;letter-spacing:-.4px;overflow-wrap:anywhere}
.delivery-summary p{margin:4px 0 0;color:#61758e;font-size:14px;line-height:1.6;overflow-wrap:anywhere}
.delivery-summary>strong{flex-shrink:0;max-width:45%;margin-left:auto;color:#1c334d;font-size:22px;line-height:1.25;letter-spacing:-.5px;font-variant-numeric:tabular-nums;text-align:right;overflow-wrap:anywhere}
.delivery-key-card{padding:19px 20px;border:1px solid #cde8dd;border-radius:17px;background:linear-gradient(130deg,#eff9f5,#f8fcfa);min-width:0}
.delivery-key-card>label,
.delivery-key-card>p{display:block;margin:0 0 11px;color:#315e50;font-size:15px;font-weight:600;line-height:1.5}
.delivery-key-control{display:flex;align-items:stretch;gap:9px;min-width:0}
.delivery-key-control input{display:block;flex:1 1 auto;width:100%;min-width:0;min-height:48px;padding:11px 13px;border:1px solid #cddfd8;border-radius:10px;background:#fff;color:#244e42;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:16px;font-weight:600;letter-spacing:.2px;line-height:1.5;caret-color:transparent}
.delivery-key-control input:focus{outline:2px solid #5b9d89;outline-offset:2px}
.delivery-key-control button{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:0 0 auto;min-width:112px;min-height:48px;padding:11px 13px;border:1px solid #bed9ce;border-radius:10px;background:#e1f1e9;color:#275e4b;font-size:14px;font-weight:600;line-height:1.4;transition:background .18s ease,border-color .18s ease}
.delivery-key-control button:hover{background:#cfe8dc;border-color:#9dc3b2}
.delivery-key-control button .icon{width:18px;height:18px;flex:0 0 18px}
.delivery-key-control button:focus-visible{outline:3px solid #6d9fea;outline-offset:3px}
.delivery-key-card>small{display:block;margin-top:10px;color:#4f7869;font-size:12px;line-height:1.65;overflow-wrap:anywhere}
.delivery-instructions{margin-top:23px;min-width:0}
.delivery-instructions h3{font-size:19px;font-weight:600;line-height:1.4;letter-spacing:-.3px;margin:0 0 15px}
.delivery-instructions ol{counter-reset:delivery-step;list-style:none;display:grid;gap:16px;padding:0;margin:0}
.delivery-instructions li{counter-increment:delivery-step;position:relative;min-height:30px;padding-left:42px}
.delivery-instructions li::before{content:counter(delivery-step);position:absolute;top:0;left:0;display:grid;place-items:center;width:29px;height:29px;border:1px solid #dce7fb;border-radius:9px;background:#edf3ff;color:#3569ce;font-size:12px;font-weight:600;line-height:1}
.delivery-instructions li strong{display:block;color:#213448;font-size:15px;font-weight:600;line-height:1.5}
.delivery-instructions li p{margin:4px 0 0;color:#61758e;font-size:14px;line-height:1.65;overflow-wrap:anywhere}
.delivery-instructions li a:not(.primary-button){color:#2e63d3;text-decoration:underline;text-underline-offset:3px}
.delivery-activation-link.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:45px;margin-top:17px;padding:10px 15px;border-radius:10px;font-size:14px;line-height:1.5;text-align:center}
.delivery-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:23px;padding-top:21px;border-top:1px solid #e2e9f1}
.delivery-actions>.primary-button,
.delivery-actions>.secondary-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:1 1 210px;min-width:0;min-height:49px;padding:12px 16px;border-radius:11px;font-size:15px;line-height:1.5;text-align:center}
.delivery-actions>.secondary-button{background:#edf3fb;color:#345e99;border:1px solid #dce6f5}
.delivery-actions>.secondary-button:hover{background:#e0ebfa;color:#244d88}
.delivery-local-note{margin:13px 0 0;color:#6e8199;font-size:12px;line-height:1.65;overflow-wrap:anywhere}
.delivery-history-intro{margin:19px 0;color:#61758e;font-size:14px;line-height:1.7;overflow-wrap:anywhere}
.delivery-history-list{display:grid;gap:12px}
.delivery-history-card{min-width:0;padding:19px 20px;border:1px solid #dfe7f1;border-radius:17px;background:#fff}
.delivery-history-top{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:9px 14px;min-width:0}
.delivery-history-top h3{flex:1 1 180px;min-width:0;font-size:19px;font-weight:600;line-height:1.4;letter-spacing:-.3px;overflow-wrap:anywhere}
.delivery-status{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:5px 9px;border:1px solid #cfe6db;border-radius:8px;background:#eef8f3;color:#36745d;font-size:12px;font-weight:500;line-height:1.4;overflow-wrap:anywhere}
.delivery-history-card>p{margin:9px 0 0;color:#61758e;font-size:14px;line-height:1.65;overflow-wrap:anywhere}
.delivery-history-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 20px;margin-top:15px;padding-top:15px;border-top:1px solid #e9edf4}
.delivery-history-bottom>strong{font-size:21px;line-height:1.3;letter-spacing:-.4px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.delivery-history-bottom>.secondary-button{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:10px 13px;border:1px solid #dbe5f5;border-radius:10px;background:#edf3fd;color:#315c9b;font-size:14px;line-height:1.5;text-align:center}
.delivery-history-bottom>.secondary-button:hover{background:#dfeafb;border-color:#b9cceb}
#store-dialog[data-view="account"] .delivery-history-entry{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:19px;padding:12px 14px;border:1px solid #dce6f4;border-radius:11px;background:#f4f8fd;color:#345e99;font-size:14px;line-height:1.5;text-align:center}
#store-dialog[data-view="account"] .delivery-history-entry:hover{background:#e8f0fc;border-color:#c4d6ef}
#store-dialog[data-view="payment"] .payment-status[data-demo="true"]{border-color:#cfe3e6;background:linear-gradient(120deg,#edf8f4,#f0f6ff);color:#456e68}
#store-dialog[data-view="payment"] .payment-status[data-demo="true"] strong{color:#2f6259;font-weight:600}
#store-dialog[data-view="payment"] .payment-actions>button:disabled{opacity:.65;cursor:wait;transform:none;box-shadow:none}
@media(max-width:620px){
  #store-dialog[data-view="demo-delivery"],
  #store-dialog[data-view="demo-history"]{width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:22px 20px;border-radius:23px;scrollbar-gutter:auto}
  #store-dialog[data-view="demo-delivery"] .modal-head,
  #store-dialog[data-view="demo-history"] .modal-head{gap:12px;padding-bottom:17px}
  #store-dialog[data-view="demo-delivery"] .modal-head h2,
  #store-dialog[data-view="demo-history"] .modal-head h2{font-size:25px;letter-spacing:-.6px}
  .delivery-summary{flex-wrap:wrap;padding:15px;gap:12px}
  .delivery-summary>div{flex-basis:calc(100% - 62px)}
  .delivery-summary>strong{max-width:100%;margin:0 0 0 62px;font-size:21px;text-align:left}
  .delivery-key-card{padding:16px}
  .delivery-key-control{flex-wrap:wrap}
  .delivery-key-control input{flex-basis:100%;font-size:16px;padding:11px 10px}
  .delivery-key-control button{width:100%;min-height:43px;padding:10px 13px}
  .delivery-instructions{margin-top:21px}
  .delivery-instructions li{padding-left:39px}
  .delivery-activation-link.primary-button{width:100%}
  .delivery-actions{margin-top:21px;padding-top:18px}
  .delivery-actions>.primary-button,.delivery-actions>.secondary-button{flex-basis:100%}
  .delivery-history-card{padding:17px}
  .delivery-history-top h3{font-size:18px}
  .delivery-history-bottom>.secondary-button{width:100%}
}
@media(max-width:380px){
  #store-dialog[data-view="demo-delivery"],
  #store-dialog[data-view="demo-history"]{padding:20px 17px}
  #store-dialog[data-view="demo-delivery"] .modal-head h2,
  #store-dialog[data-view="demo-history"] .modal-head h2{font-size:23px}
  .delivery-key-card{padding:14px}
  .delivery-key-control input{font-size:15px;letter-spacing:0}
}
@media(prefers-reduced-motion:reduce){.delivery-key-control button{transition:none}}