/* Public order page only; administration retains its current styling. */
.order-page header.site-header{gap:14px;padding:20px}
.order-page .brand-logo{width:180px;height:180px}
.order-page .header-nav{flex-wrap:nowrap;gap:10px}
.order-page .header-nav a{min-height:44px;min-width:100px;text-align:center}
.order-page .product{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:12px;padding:12px}
.order-page .bread-art{width:96px;height:96px;background:var(--paper);border:1px solid var(--green);border-radius:7px;overflow:hidden}
.order-page .bread-art img{width:100%;height:100%;object-fit:contain;background:var(--paper)}
.order-page .product-info{min-width:0}
.order-page .product h3{font-size:24px;line-height:1.15;margin:0 0 4px}
.order-page .product p{margin:0 0 3px}
.order-page .product .hint:empty{display:none}
.order-page .price{font-size:15px}
.order-page .quantity{margin:0;justify-self:end;align-self:center}
.order-page .quantity button{width:44px;min-height:44px}
.order-page .customer-profile{margin-top:36px;padding:0;background:#fffefb;border:1px solid var(--line);border-radius:9px}
.order-page .customer-profile>h2{margin:0}
.profile-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 26px;border:0;border-radius:9px;background:transparent;color:var(--green);text-align:left;font:inherit}
.profile-toggle::after{content:'';width:10px;height:10px;flex-shrink:0;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s}
.profile-toggle[aria-expanded="true"]::after{transform:rotate(225deg)}
.profile-panel{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .25s ease,visibility .25s}
.profile-panel.is-open{grid-template-rows:1fr;visibility:visible}
.profile-panel-inner{min-height:0;overflow:hidden}
.profile-panel-content{padding:0 26px 22px}
@media(max-width:650px){
  .order-page .brand-logo{width:160px;height:160px}
  .order-page .products{gap:10px}
  .order-page .product{grid-template-columns:80px minmax(0,1fr);gap:6px 12px;padding:10px}
  .order-page .bread-art{width:80px;height:80px;grid-row:1 / 3;align-self:start}
  .order-page .product h3{font-size:22px}
  .order-page .product p{font-size:11px}
  .order-page .quantity{grid-column:2;justify-self:start}
  .order-page .quantity input{width:32px}
  .profile-toggle{padding:18px;font-size:24px}
  .profile-panel-content{padding:0 18px 18px}
}
@media(prefers-reduced-motion:reduce){.profile-panel,.profile-toggle::after{transition:none}}

/* Explanations appear in the same compact popup style as the order animation. */
.order-page .capacity-video-dialog{width:min(420px,calc(100% - 32px));max-height:90dvh;padding:32px 22px 22px;border-radius:18px;text-align:center;color:var(--ink)}
.order-page .capacity-video-dialog::backdrop{background:rgba(35,39,27,.45)}
.order-page .capacity-video-heading{justify-content:center;margin-bottom:12px}
.order-page .capacity-video-heading h2{padding:0 12px;font-size:26px}
.order-page .capacity-video-heading button{position:absolute;right:8px;top:6px;width:44px;height:44px;border:0;background:transparent;color:var(--green);font-size:28px}
.order-page .capacity-video-dialog video{max-height:55dvh;object-fit:contain}
.order-page .capacity-video-dialog p{font-size:13px;color:var(--muted)}
.order-page #capacity-video{touch-action:pan-y;cursor:pointer}
.explainer-navigation{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
.explainer-navigation button{min-height:44px;padding:8px 12px;border:1px solid var(--green);border-radius:6px;background:var(--paper);color:var(--green);font:inherit;font-size:13px}
.explainer-navigation span{font-size:12px;color:var(--muted);white-space:nowrap}

/* Draw attention to the selected day's updated preview without moving it. */
.order-page .day-capacity-option.capacity-changed{animation:capacity-highlight 1.2s ease-out}
@keyframes capacity-highlight{0%,30%{box-shadow:0 0 0 3px #ba8b3b,inset 0 0 0 2px #f9f7f0}100%{box-shadow:0 0 0 0 transparent,inset 0 0 0 0 transparent}}
@media(prefers-reduced-motion:reduce){.order-page .day-capacity-option.capacity-changed{animation:none;outline:2px solid #ba8b3b;outline-offset:2px}}

/* Make both explainer entry points easy to spot. */
.order-page .capacity-video-open,.order-page .capacity-joke-open{min-width:48px;min-height:48px;border:2px solid #a03223;background:#fff0eb;color:#a03223;font-weight:bold;box-shadow:0 2px 5px #a032231a}
.order-page .capacity-video-open{padding:10px 14px;font-size:14px}
.order-page .capacity-joke-open{padding:10px 14px;font-size:14px}
.order-page .capacity-video-open:hover,.order-page .capacity-joke-open:hover{background:#a03223;color:#fff}

/* Prominent action for adding another delivery day. */
.order-page .add-delivery-row{gap:12px;align-items:center}
.order-page #add-delivery-day{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:60px;margin-top:0;padding:12px 18px;border:2px solid #ba8b3b;border-radius:9px;background:var(--green);color:#fff;font-size:15px;font-weight:bold;line-height:1.3;box-shadow:0 3px 0 #303b25}
.order-page #add-delivery-day::before{content:'+';display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:#f4d99e;color:#302e25;font-size:25px;font-weight:normal;line-height:1}
.order-page #add-delivery-day:hover{background:#303b25;border-color:#d0a24e}
.order-page #add-delivery-day:active{transform:translateY(2px);box-shadow:0 1px 0 #303b25}
@media(max-width:650px){.order-page #add-delivery-day{flex:1;min-width:0;padding:12px;font-size:14px}.order-page .add-delivery-row{flex-wrap:nowrap}.order-page .add-delivery-help{flex-shrink:0}}
