/* ============================================
   CHECKOUT + ORDER CONFIRMATION — Premium Design
   ============================================ */

/* --- LAYOUT: FORM + SIDEBAR --- */
.checkout-layout{display:grid;grid-template-columns:1fr 340px;gap:32px;max-width:960px;margin:0 auto;padding:0 24px 60px}
.checkout-main{min-width:0}
.checkout-sidebar{position:sticky;top:80px;align-self:start}

/* --- TRUST BAR --- */
.trust-bar{display:flex;align-items:center;justify-content:center;gap:24px;padding:14px 20px;margin-bottom:32px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.04);border-radius:14px}
.trust-item{display:flex;align-items:center;gap:6px;font-size:.68rem;color:var(--text-muted);letter-spacing:.3px}
.trust-item svg{width:14px;height:14px;color:var(--olive);flex-shrink:0}
.trust-divider{width:1px;height:16px;background:rgba(255,255,255,.06)}

/* --- STEPS INDICATOR --- */
.checkout-steps{display:flex;align-items:center;justify-content:center;gap:0;padding:20px 28px;margin-bottom:36px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05);border-radius:16px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.step{display:flex;align-items:center;gap:8px;opacity:.3;transition:opacity .4s cubic-bezier(.4,0,.2,1)}
.step.active{opacity:1}
.step.done{opacity:.6}
.step-num{width:30px;height:30px;border-radius:50%;border:1.5px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:600;color:var(--text-muted);transition:all .4s cubic-bezier(.4,0,.2,1)}
.step.active .step-num{background:var(--yellow);border-color:var(--yellow);color:var(--black);box-shadow:0 0 20px rgba(232,227,77,.3),0 0 40px rgba(232,227,77,.1)}
.step.done .step-num{background:rgba(74,93,35,.2);border-color:var(--olive);color:var(--olive)}
.step-label{font-size:.72rem;font-weight:500;color:var(--text-muted);letter-spacing:.3px;transition:color .3s}
.step.active .step-label{color:var(--text)}
.step-line{width:48px;height:2px;background:rgba(255,255,255,.06);margin:0 10px;border-radius:2px;overflow:hidden;position:relative}
.step-line::after{content:'';position:absolute;top:0;left:0;height:100%;width:0;background:var(--olive);border-radius:2px;transition:width .5s cubic-bezier(.4,0,.2,1)}
.step.done+.step-line::after,.step-line.filled::after{width:100%}

/* --- FORM CARD --- */
.checkout-form-card{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05);border-radius:20px;padding:32px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:stepFadeIn .45s cubic-bezier(.4,0,.2,1) both}
.checkout-title{font-size:1.15rem;font-weight:700;margin-bottom:22px;color:var(--white);display:flex;align-items:center;gap:10px}
.checkout-title svg{width:18px;height:18px;color:var(--yellow);flex-shrink:0}

/* --- FORM --- */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:.7rem;font-weight:500;color:var(--text-muted);margin-bottom:6px;letter-spacing:.4px;text-transform:uppercase}
.form-group input,.form-group textarea{width:100%;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:13px 16px;color:var(--white);font-family:inherit;font-size:.84rem;outline:none;transition:all .3s cubic-bezier(.4,0,.2,1);min-height:46px}
.form-group input:focus,.form-group textarea:focus{border-color:rgba(232,227,77,.45);background:rgba(255,255,255,.055);box-shadow:0 0 0 3px rgba(232,227,77,.08),0 0 24px rgba(232,227,77,.05)}
.form-group input::placeholder,.form-group textarea::placeholder{color:rgba(255,255,255,.18)}
.form-group textarea{resize:vertical;line-height:1.5;min-height:72px}
.form-group input:valid:not(:placeholder-shown){border-color:rgba(74,93,35,.3)}

/* --- PAYMENT METHODS --- */
.payment-methods{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}
.payment-option{display:flex;align-items:center;gap:14px;padding:16px 18px;background:rgba(255,255,255,.025);border:1.5px solid rgba(255,255,255,.05);border-radius:16px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}
.payment-option:hover{border-color:rgba(255,255,255,.1);background:rgba(255,255,255,.04);transform:translateY(-1px)}
.payment-option.selected{border-color:rgba(232,227,77,.4);background:rgba(232,227,77,.04);box-shadow:0 0 24px rgba(232,227,77,.06),inset 0 0 24px rgba(232,227,77,.02)}
.payment-option input[type="radio"]{display:none}
.payment-icon{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .3s}
.payment-option.selected .payment-icon{background:rgba(232,227,77,.1)}
.payment-icon svg{width:20px;height:20px;color:var(--yellow)}
.payment-icon-tabby{background:rgba(232,227,77,.06)}
.payment-icon-tamara{background:rgba(129,83,240,.08)}
.payment-icon-tamara svg{color:#8153f0}
.payment-info{flex:1;display:flex;flex-direction:column;gap:3px}
.payment-title{font-size:.85rem;font-weight:600;color:var(--text);display:flex;align-items:center;gap:8px}
.payment-desc{font-size:.7rem;color:var(--text-muted)}
.coming-badge{background:rgba(255,255,255,.07);color:var(--text-muted);font-size:.58rem;padding:3px 10px;border-radius:100px;font-weight:500;letter-spacing:.3px;border:1px solid rgba(255,255,255,.05)}
.payment-check{width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .3s}
.payment-check svg{width:11px;height:11px;opacity:0;color:var(--yellow);transition:opacity .3s}
.payment-option.selected .payment-check{background:var(--yellow);border-color:var(--yellow);box-shadow:0 0 12px rgba(232,227,77,.3)}
.payment-option.selected .payment-check svg{opacity:1;color:var(--black)}
.payment-option.disabled{opacity:.4;cursor:not-allowed}

/* --- CONFIRM CARDS --- */
.confirm-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
.confirm-card{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05);border-radius:16px;padding:22px;transition:all .3s cubic-bezier(.4,0,.2,1)}
.confirm-card:hover{border-color:rgba(255,255,255,.09);transform:translateY(-1px)}
.confirm-card h3{font-size:.72rem;font-weight:600;color:var(--text-muted);letter-spacing:.5px;margin-bottom:12px;text-transform:uppercase;display:flex;align-items:center;gap:6px}
.confirm-card h3 svg{width:14px;height:14px;opacity:.5}
.confirm-card p{font-size:.82rem;color:var(--text);margin:4px 0;line-height:1.5}
.confirm-items-card{margin-bottom:0}
.btn-link{background:none;border:none;color:var(--yellow);font-family:inherit;font-size:.74rem;cursor:pointer;padding:0;margin-top:12px;transition:all .2s;display:inline-flex;align-items:center;gap:4px}
.btn-link:hover{opacity:.7;gap:6px}
.btn-link svg{width:12px;height:12px}

/* --- CONFIRM ITEM ROWS --- */
.confirm-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.04)}
.confirm-item:last-child{border-bottom:none}
.confirm-item-img{width:48px;height:48px;border-radius:10px;object-fit:cover;background:rgba(255,255,255,.04);flex-shrink:0}
.confirm-item-info{flex:1;min-width:0}
.confirm-item-name{font-size:.8rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.confirm-item-meta{font-size:.68rem;color:var(--text-muted);margin-top:2px}
.confirm-item-price{font-size:.82rem;font-weight:600;color:var(--yellow);flex-shrink:0}

/* --- ORDER SUMMARY (SIDEBAR) --- */
.checkout-summary-card{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05);border-radius:20px;padding:24px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.checkout-summary-title{font-size:.72rem;font-weight:600;color:var(--text-muted);letter-spacing:.5px;text-transform:uppercase;margin-bottom:16px;display:flex;align-items:center;justify-content:space-between}
.checkout-summary-count{background:rgba(232,227,77,.1);color:var(--yellow);font-size:.62rem;padding:2px 8px;border-radius:100px;font-weight:600}
.checkout-summary-items{max-height:320px;overflow-y:auto;margin-bottom:16px;padding-right:4px}
.checkout-summary-items::-webkit-scrollbar{width:3px}
.checkout-summary-items::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:4px}
.checkout-summary-item{display:flex;align-items:center;gap:10px;padding:8px 0}
.checkout-summary-item+.checkout-summary-item{border-top:1px solid rgba(255,255,255,.03)}
.checkout-summary-item-img{width:40px;height:40px;border-radius:8px;object-fit:cover;background:rgba(255,255,255,.04);flex-shrink:0}
.checkout-summary-item-info{flex:1;min-width:0}
.checkout-summary-item-name{font-size:.74rem;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.checkout-summary-item-meta{font-size:.64rem;color:var(--text-muted);margin-top:1px}
.checkout-summary-item-price{font-size:.74rem;font-weight:600;color:var(--yellow);flex-shrink:0}
.checkout-summary-divider{height:1px;background:rgba(255,255,255,.05);margin:12px 0}
.checkout-summary-row{display:flex;justify-content:space-between;font-size:.76rem;color:var(--text-muted);margin-bottom:6px}
.checkout-summary-row.total{font-size:.92rem;font-weight:700;color:var(--yellow);margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.06);margin-bottom:0}
.checkout-summary-shipping{display:flex;align-items:center;gap:6px}
.checkout-summary-shipping.free{color:var(--olive);font-weight:500}
.checkout-summary-free-badge{background:rgba(74,93,35,.15);color:var(--olive);font-size:.6rem;padding:2px 8px;border-radius:100px;font-weight:600}

/* --- SUMMARY IN CONFIRM STEP --- */
.confirm-summary{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.05)}
.confirm-summary-row{display:flex;justify-content:space-between;font-size:.8rem;color:var(--text-muted);margin-bottom:6px}
.confirm-summary-row.total{font-size:.95rem;font-weight:700;color:var(--yellow);margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.06)}

/* --- NAV BUTTONS --- */
.checkout-nav-btns{display:flex;justify-content:space-between;gap:12px;margin-top:24px}
.checkout-next-btn{min-height:50px;font-size:.8rem;font-weight:600;letter-spacing:.4px;padding:14px 32px}

/* --- STEP TRANSITIONS --- */
.checkout-section{animation:stepFadeIn .45s cubic-bezier(.4,0,.2,1) both}
@keyframes stepFadeIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

/* --- EMPTY STATE --- */
.checkout-empty{text-align:center;padding:80px 24px}
.checkout-empty svg{opacity:.15;margin-bottom:20px;animation:emptyPulse 3s ease-in-out infinite}
@keyframes emptyPulse{0%,100%{opacity:.15;transform:scale(1)}50%{opacity:.25;transform:scale(1.05)}}
.checkout-empty h2{font-size:1.2rem;margin:0 0 8px;color:var(--text)}
.checkout-empty p{color:var(--text-muted);font-size:.84rem;margin-bottom:28px;line-height:1.6}

/* --- LOADING OVERLAY --- */
.checkout-loading{position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:5000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:fadeIn .3s ease}
.checkout-loading p{color:var(--text);font-size:.88rem;font-weight:500}
.checkout-loading .loading-sub{color:var(--text-muted);font-size:.74rem;margin-top:-8px}
.checkout-spinner{width:36px;height:36px;border:2.5px solid rgba(255,255,255,.08);border-top-color:var(--yellow);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* --- SUCCESS OVERLAY --- */
.checkout-success{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:5000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);animation:fadeIn .4s ease}
.checkout-success .success-icon{width:72px;height:72px;border-radius:50%;background:rgba(74,93,35,.2);border:2px solid var(--olive);display:flex;align-items:center;justify-content:center;animation:successPop .5s cubic-bezier(.4,0,.2,1) both}
.checkout-success .success-icon svg{width:32px;height:32px;color:var(--olive)}
.checkout-success h2{font-size:1.2rem;font-weight:700;color:var(--white)}
.checkout-success p{color:var(--text-muted);font-size:.82rem}
@keyframes successPop{from{transform:scale(0);opacity:0}50%{transform:scale(1.15)}to{transform:scale(1);opacity:1}}

/* ============================================
   ORDER CONFIRMATION PAGE
   ============================================ */

/* --- ORDER PAGE LAYOUT --- */
.order-page{min-height:100vh;padding:0 24px 60px;max-width:700px;margin:0 auto}

/* --- ORDER HEADER --- */
.order-header{text-align:center;margin-bottom:32px;padding-top:10px}
.order-header .check-icon{width:72px;height:72px;border-radius:50%;background:rgba(74,93,35,.15);border:2px solid rgba(74,93,35,.4);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;position:relative;animation:orderCheckPop .6s cubic-bezier(.4,0,.2,1) both}
.order-header .check-icon::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:1.5px solid rgba(74,93,35,.15);animation:orderCheckRing 2s ease-in-out infinite}
.order-header .check-icon svg{width:30px;height:30px;color:var(--olive);animation:orderCheckDraw .4s ease .3s both}
@keyframes orderCheckPop{from{transform:scale(0);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}
@keyframes orderCheckRing{0%,100%{opacity:.3;transform:scale(1)}50%{opacity:.8;transform:scale(1.08)}}
@keyframes orderCheckDraw{from{stroke-dasharray:50;stroke-dashoffset:50}to{stroke-dasharray:50;stroke-dashoffset:0}}
.order-header h1{font-size:1.6rem;font-weight:700;margin-bottom:6px;letter-spacing:-.3px}
.order-header>p{color:var(--text-muted);font-size:.84rem;line-height:1.5}
.order-id-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px}
.order-id-display{padding:6px 16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:100px;font-size:.72rem;color:var(--text-muted);font-family:'SF Mono',SFMono-Regular,ui-monospace,monospace;letter-spacing:.8px;cursor:pointer;transition:all .3s;display:inline-flex;align-items:center;gap:6px}
.order-id-display:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1)}
.order-id-display svg{width:12px;height:12px;opacity:.4}
.order-id-display.copied{border-color:rgba(74,93,35,.4);color:var(--olive)}
.order-status-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:100px;font-size:.7rem;font-weight:600;letter-spacing:.3px;margin-top:12px}
.order-status-badge.pending{background:rgba(232,227,77,.08);color:var(--yellow);border:1px solid rgba(232,227,77,.15)}
.order-status-badge.confirmed{background:rgba(74,93,35,.12);color:var(--olive);border:1px solid rgba(74,93,35,.25)}
.order-status-badge .status-dot{width:6px;height:6px;border-radius:50%;background:currentColor;animation:statusPulse 2s ease-in-out infinite}
@keyframes statusPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}

/* --- ORDER SECTIONS --- */
.order-section{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05);border-radius:18px;padding:22px;margin-bottom:14px;transition:all .3s}
.order-section:hover{border-color:rgba(255,255,255,.08)}
.order-section h3{font-size:.72rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px;display:flex;align-items:center;gap:6px}
.order-section h3 svg{width:14px;height:14px;opacity:.4}
.order-section p{font-size:.82rem;color:var(--text);margin:4px 0;line-height:1.5}

/* --- ORDER ITEMS --- */
.order-item{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.03)}
.order-item:last-child{border-bottom:none}
.order-item-img{width:52px;height:52px;border-radius:12px;object-fit:cover;background:rgba(255,255,255,.04);flex-shrink:0;border:1px solid rgba(255,255,255,.04)}
.order-item-info{flex:1;min-width:0}
.order-item-name{font-size:.84rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.order-item-meta{font-size:.68rem;color:var(--text-muted);margin-top:3px}
.order-item-price{font-size:.84rem;font-weight:600;color:var(--yellow);flex-shrink:0}

/* --- ORDER TOTALS --- */
.order-totals-row{display:flex;justify-content:space-between;font-size:.8rem;color:var(--text-muted);padding:4px 0}
.order-totals-row.total{font-size:.95rem;font-weight:700;color:var(--yellow);padding-top:10px;margin-top:6px;border-top:1px solid rgba(255,255,255,.05)}

/* --- WHAT'S NEXT TIMELINE --- */
.order-timeline{position:relative;padding-left:28px;margin:20px 0 4px}
.timeline-step{position:relative;padding-bottom:24px;padding-left:20px}
.timeline-step:last-child{padding-bottom:0}
.timeline-step::before{content:'';position:absolute;left:-28px;top:2px;width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.1);z-index:1}
.timeline-step::after{content:'';position:absolute;left:-23px;top:16px;width:2px;height:calc(100% - 12px);background:rgba(255,255,255,.05)}
.timeline-step:last-child::after{display:none}
.timeline-step.active::before{background:var(--yellow);border-color:var(--yellow);box-shadow:0 0 12px rgba(232,227,77,.3)}
.timeline-step.done::before{background:var(--olive);border-color:var(--olive)}
.timeline-step.done::after{background:rgba(74,93,35,.3)}
.timeline-label{font-size:.82rem;font-weight:600;color:var(--text-muted);margin-bottom:2px}
.timeline-step.active .timeline-label{color:var(--yellow)}
.timeline-step.done .timeline-label{color:var(--olive)}
.timeline-desc{font-size:.7rem;color:var(--text-muted);opacity:.6}

/* --- ACTION BUTTONS --- */
.order-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.order-actions .btn{min-height:48px;font-size:.76rem;padding:14px 28px}
.order-actions .btn-whatsapp{background:var(--yellow);color:var(--black);box-shadow:0 4px 20px rgba(232,227,77,.2);font-weight:600;letter-spacing:.3px}
.order-actions .btn-whatsapp:hover{background:#f0e855;transform:translateY(-2px);box-shadow:0 8px 30px rgba(232,227,77,.3)}
.order-actions .btn-whatsapp svg{width:16px;height:16px}

/* --- SHARE ROW --- */
.order-share{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px}
.order-share-btn{display:inline-flex;align-items:center;gap:5px;padding:8px 14px;font-size:.7rem;color:var(--text-muted);background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.05);border-radius:100px;cursor:pointer;transition:all .3s;font-family:inherit}
.order-share-btn:hover{background:rgba(255,255,255,.06);color:var(--text);border-color:rgba(255,255,255,.1)}
.order-share-btn svg{width:13px;height:13px}

/* --- ORDER EMPTY --- */
.order-empty{text-align:center;padding:80px 24px}
.order-empty svg{opacity:.12;margin-bottom:16px}
.order-empty h2{font-size:1.1rem;margin-bottom:6px}
.order-empty p{color:var(--text-muted);font-size:.84rem;margin-bottom:24px;line-height:1.5}

/* --- LOADING STATE --- */
.order-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:100px 24px;gap:16px}
.order-loading .checkout-spinner{margin:0 auto}

/* ============================================
   RESPONSIVE
   ============================================ */
@media(max-width:900px){
    .checkout-layout{grid-template-columns:1fr;max-width:560px}
    .checkout-sidebar{position:static;order:-1}
    .checkout-summary-items{max-height:none}
}
@media(max-width:768px){
    .checkout-layout{padding:0 16px 40px}
    .checkout-form-card{padding:24px 18px;border-radius:16px}
    .form-row{grid-template-columns:1fr}
    .confirm-grid{grid-template-columns:1fr}
    .checkout-steps{padding:16px 18px;margin-bottom:28px}
    .step-label{display:none}
    .step-line{width:32px}
    .checkout-title{font-size:1rem}
    .payment-option{padding:14px 14px}
    .trust-bar{gap:14px;padding:12px 14px;flex-wrap:wrap}
    .trust-divider{display:none}
    .order-page{padding:0 16px 40px}
    .order-actions{flex-direction:column}
    .order-actions .btn{width:100%;justify-content:center}
    .checkout-summary-card{padding:18px}
}
@media(max-width:480px){
    .checkout-layout{padding:0 14px 32px}
    .checkout-form-card{padding:18px 14px}
    .checkout-nav-btns{flex-direction:column}
    .checkout-nav-btns .btn{width:100%;justify-content:center}
    .checkout-next-btn{min-height:48px}
    .order-page{padding:0 14px 32px}
    .order-id-row{flex-direction:column;gap:6px}
    .order-share{flex-wrap:wrap}
}

/* --- PRINT --- */
@media print{
    .navbar,.footer,.chat-widget,.music-player,.back-to-top,.order-actions,.order-share,.trust-bar,.checkout-sidebar{display:none!important}
    .order-page{padding:20px 0;max-width:100%}
    .checkout-layout{display:block}
    body{background:#fff;color:#111}
    .order-section,.confirm-card,.checkout-form-card,.checkout-summary-card{border-color:#ddd;background:#f9f9f9;color:#111}
    .order-section h3,.confirm-card h3,.checkout-title{color:#333}
    .order-section p,.confirm-card p{color:#111}
    .order-totals-row.total,.confirm-summary-row.total,.checkout-summary-row.total{color:#111}
    .order-header .check-icon{border-color:#4a5d23;background:rgba(74,93,35,.1)}
    .order-status-badge.pending{border-color:#ccc;background:#f5f5f5;color:#333}
    .order-status-badge.confirmed{border-color:#4a5d23;background:rgba(74,93,35,.1);color:#4a5d23}
    .order-item-img{border-color:#ddd}
    .order-id-display{border-color:#ddd;background:#f5f5f5;color:#333}
}