:root{--primary-color: #000;--secondary-color: #fff;--accent-color: #2962ff;--success-color: #00c853;--warning-color: #ff6d00;--error-color: #d50000;--text-primary: #1a1a1a;--text-secondary: #666;--border-color: #e0e0e0;--background-light: #fafafa;--shadow-sm: 0 2px 8px rgba(0,0,0,.08);--shadow-md: 0 4px 16px rgba(0,0,0,.12);--transition: all .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box}.track-order-page{min-height:70vh;padding:60px 20px;background:linear-gradient(135deg,#fafafa,#fff)}.track-order-container{max-width:680px;margin:0 auto}.track-order-hero{text-align:center;margin-bottom:48px;animation:fadeInUp .6s ease}.track-title{font-size:42px;font-weight:700;letter-spacing:-.02em;color:var(--text-primary);margin:0 0 12px;line-height:1.2}.track-subtitle{font-size:16px;color:var(--text-secondary);margin:0;line-height:1.6}.track-tabs{display:flex;gap:12px;margin-bottom:32px;background:var(--secondary-color);padding:6px;border-radius:12px;box-shadow:var(--shadow-sm)}.track-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 20px;background:transparent;border:none;border-radius:8px;font-size:15px;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:var(--transition)}.track-tab svg{transition:var(--transition)}.track-tab:hover{background:var(--background-light);color:var(--text-primary)}.track-tab.active{background:var(--primary-color);color:var(--secondary-color);box-shadow:var(--shadow-sm)}.track-tab.active svg{stroke:var(--secondary-color)}.track-forms{position:relative;margin-bottom:40px}.track-form-wrapper{display:none;animation:fadeIn .4s ease}.track-form-wrapper.active{display:block}.track-form{background:var(--secondary-color);padding:32px;border-radius:16px;box-shadow:var(--shadow-md)}.input-wrapper{position:relative;margin-bottom:24px}.track-input{width:100%;padding:16px;font-size:16px;border:2px solid var(--border-color);border-radius:10px;background:var(--secondary-color);transition:var(--transition);outline:none}.track-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 4px #0000000d}.track-input:focus+.input-label,.track-input:not(:placeholder-shown)+.input-label{transform:translateY(-32px) scale(.85);color:var(--text-primary);font-weight:500}.input-label{position:absolute;left:16px;top:17px;color:var(--text-secondary);font-size:15px;pointer-events:none;transition:var(--transition);background:var(--secondary-color);padding:0 4px;transform-origin:left center}.track-button{width:100%;padding:16px 24px;background:var(--primary-color);color:var(--secondary-color);border:none;border-radius:10px;font-size:16px;font-weight:600;cursor:pointer;transition:var(--transition);position:relative;overflow:hidden}.track-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00000026}.track-button:active{transform:translateY(0)}.track-button.loading{pointer-events:none}.track-button.loading .button-text{opacity:0}.track-button.loading .button-loader{opacity:1}.button-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;transition:opacity .3s}.spinner{width:24px;height:24px;animation:spin .8s linear infinite}.form-hint{margin:12px 0 0;font-size:13px;color:var(--text-secondary);text-align:center}.track-results{display:none;animation:fadeInUp .5s ease}.track-results.show{display:block}.result-card{background:var(--secondary-color);padding:32px;border-radius:16px;box-shadow:var(--shadow-md)}.result-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:24px;border-bottom:2px solid var(--background-light);margin-bottom:32px}.result-order-info h2{font-size:24px;font-weight:700;color:var(--text-primary);margin:0 0 8px}.result-order-info p{font-size:14px;color:var(--text-secondary);margin:0}.result-status-badge{padding:8px 16px;border-radius:8px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.status-preparing{background:#fff3e0;color:var(--warning-color)}.status-shipped{background:#e3f2fd;color:var(--accent-color)}.status-delivered{background:#e8f5e9;color:var(--success-color)}.tracking-timeline{margin-top:32px}.timeline-title{font-size:18px;font-weight:600;color:var(--text-primary);margin:0 0 24px}.timeline-item{position:relative;padding-left:40px;padding-bottom:28px}.timeline-item:before{content:"";position:absolute;left:11px;top:28px;width:2px;height:100%;background:var(--border-color)}.timeline-dot{position:absolute;left:0;top:4px;width:24px;height:24px;border-radius:50%;background:var(--secondary-color);border:3px solid var(--border-color);transition:var(--transition)}.timeline-item.active .timeline-dot{border-color:var(--success-color);background:var(--success-color);box-shadow:0 0 0 4px #00c8531a}.timeline-item.completed .timeline-dot{border-color:var(--success-color);background:var(--success-color)}.timeline-content h3{font-size:15px;font-weight:600;color:var(--text-primary);margin:0 0 4px}.timeline-content p{font-size:13px;color:var(--text-secondary);margin:0}.result-error,.result-empty{text-align:center;padding:48px 32px;background:var(--secondary-color);border-radius:16px;box-shadow:var(--shadow-md)}.result-icon{width:64px;height:64px;margin:0 auto 20px;padding:16px;border-radius:50%}.result-error .result-icon{background:#ffebee;color:var(--error-color)}.result-empty .result-icon{background:#fff3e0;color:var(--warning-color)}.result-error h3,.result-empty h3{font-size:20px;font-weight:600;color:var(--text-primary);margin:0 0 12px}.result-error p,.result-empty p{font-size:15px;color:var(--text-secondary);margin:0;line-height:1.6}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 768px){.track-order-page{padding:40px 16px}.track-title{font-size:32px}.track-subtitle{font-size:15px}.track-form{padding:24px}.track-tab{font-size:14px;padding:12px 16px}.track-tab svg{width:16px;height:16px}.result-header{flex-direction:column;align-items:flex-start;gap:16px}}.shipping-route{display:flex;align-items:center;justify-content:space-between;padding:2rem;background:linear-gradient(135deg,#2c3e50,#34495e,#1a252f);border-radius:16px;margin:2rem 0;box-shadow:0 10px 40px #0000004d;position:relative;overflow:hidden}.shipping-route:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#ffffff1a,#fff0);pointer-events:none}.route-location{display:flex;align-items:center;gap:1rem;flex:1;position:relative;z-index:1}.route-icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .3s ease}.route-icon.from{background:linear-gradient(135deg,#ffffff26,#ffffff0d);color:#ecf0f1;border:1px solid rgba(255,255,255,.2)}.route-icon.to{background:linear-gradient(135deg,#95a5a6,#7f8c8d);color:#fff;box-shadow:0 4px 12px #95a5a666}.route-details{display:flex;flex-direction:column;gap:.25rem}.route-label{font-size:.75rem;color:#ecf0f1b3;font-weight:600;text-transform:uppercase;letter-spacing:1px}.route-city{font-size:1.25rem;font-weight:700;color:#ecf0f1;text-shadow:0 2px 4px rgba(0,0,0,.2)}.route-country{font-size:.875rem;color:#ecf0f1cc}.route-line{margin:0 1rem;color:#ecf0f166;flex-shrink:0;position:relative;z-index:1}.delivery-estimate-box{display:flex;align-items:center;gap:1.5rem;padding:1.5rem;background:linear-gradient(135deg,#546e7a,#455a64,#37474f);border-radius:12px;margin:1.5rem 0;box-shadow:0 8px 30px #00000040;position:relative;overflow:hidden}.delivery-estimate-box:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#ffffff14,#fff0);pointer-events:none}.estimate-icon{width:48px;height:48px;background:linear-gradient(135deg,#fff3,#ffffff1a);border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#ecf0f1;border:1px solid rgba(255,255,255,.15);position:relative;z-index:1}.estimate-content{display:flex;flex-direction:column;gap:.25rem;position:relative;z-index:1}.estimate-label{font-size:.875rem;font-weight:600;color:#ecf0f1cc;text-transform:uppercase;letter-spacing:1px}.estimate-date{font-size:1.25rem;font-weight:700;color:#ecf0f1;text-shadow:0 2px 4px rgba(0,0,0,.2)}.tracking-number{display:flex;align-items:center;gap:.5rem;margin-top:.5rem;padding:.5rem .75rem;background:#f8f9fa;border-radius:6px;display:inline-flex;font-size:.875rem;color:#6c757d}.tracking-number svg{color:#546e7a}.tracking-number strong{color:#212529;font-family:Courier New,monospace}.timeline-title{display:flex;align-items:center;gap:.5rem;margin-bottom:1.5rem;font-size:1.125rem;color:#212529}.timeline-title svg{color:#546e7a}.recipient-info-box{background:#fff;border:2px solid #e9ecef;border-radius:16px;padding:1.5rem;margin-top:2rem;transition:all .3s ease}.recipient-info-box.locked{background:linear-gradient(135deg,#fff9e6,#fff3cd);border-color:#ffc107}.recipient-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid #e9ecef}.recipient-header h3{display:flex;align-items:center;gap:.75rem;margin:0;font-size:1.125rem;color:#212529}.recipient-header svg{color:#546e7a}.locked-badge{display:flex;align-items:center;gap:.375rem;padding:.375rem .75rem;background:#ffc10733;border:1px solid #ffc107;border-radius:20px;font-size:.75rem;font-weight:600;color:#856404;text-transform:uppercase;letter-spacing:.5px}.locked-badge svg{width:12px;height:12px}.recipient-details{display:flex;flex-direction:column;gap:1.25rem}.info-row{display:flex;align-items:flex-start;gap:1rem}.info-icon{width:40px;height:40px;background:#f8f9fa;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#546e7a}.info-content{display:flex;flex-direction:column;gap:.375rem;flex:1}.info-content label{font-size:.75rem;font-weight:600;color:#6c757d;text-transform:uppercase;letter-spacing:.5px;margin-bottom:0}.info-content span{font-size:1rem;color:#212529;line-height:1.5}.masked-text{font-family:Courier New,monospace;color:#6c757d;letter-spacing:1px}.login-prompt-box{margin-top:1.5rem;padding:1.5rem;background:#ffc1071a;border:2px dashed #ffc107;border-radius:12px;text-align:center}.login-prompt-box svg{color:#856404;margin-bottom:1rem}.login-prompt-box p{margin:0 0 1.25rem;font-size:.9375rem;color:#856404;line-height:1.6}.btn-signin{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:linear-gradient(135deg,#2c3e50,#34495e);color:#fff;font-weight:600;font-size:.9375rem;border:none;border-radius:8px;text-decoration:none;transition:all .3s ease;box-shadow:0 4px 12px #2c3e504d}.btn-signin:hover{transform:translateY(-2px);box-shadow:0 6px 16px #2c3e5066;background:linear-gradient(135deg,#34495e,#2c3e50);color:#fff}.btn-signin svg{width:16px;height:16px}@media (max-width: 768px){.shipping-route{flex-direction:column;gap:1.5rem;padding:1.5rem}.route-line{transform:rotate(90deg);margin:.5rem 0}.route-location{width:100%;justify-content:center}.delivery-estimate-box{flex-direction:column;text-align:center}}.result-status-badge{padding:.75rem 1.5rem;border-radius:24px;font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;display:inline-flex;align-items:center;gap:.5rem;box-shadow:0 4px 12px #00000026;transition:all .3s ease;white-space:nowrap}.result-status-badge:before{content:"";width:8px;height:8px;border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.1)}}.status-preparing{background:linear-gradient(135deg,#ffa726,#fb8c00);color:#fff}.status-preparing:before{background:#fff}.status-shipped{background:linear-gradient(135deg,#42a5f5,#1e88e5);color:#fff}.status-shipped:before{background:#fff}.status-arrived{background:linear-gradient(135deg,#ab47bc,#8e24aa);color:#fff}.status-arrived:before{background:#fff}.status-ready{background:linear-gradient(135deg,#26c6da,#00acc1);color:#fff}.status-ready:before{background:#fff}.status-delivered{background:linear-gradient(135deg,#66bb6a,#43a047);color:#fff}.status-delivered:before{background:#fff;animation:none}.track-input::placeholder{color:transparent;transition:color .3s ease}.track-input:hover::placeholder,.track-input:focus::placeholder{color:#adb5bd}.timeline-item{display:flex;gap:1.5rem;position:relative;padding-bottom:2rem}.timeline-item:last-child{padding-bottom:0}.timeline-item:before{content:"";position:absolute;left:11px;top:24px;bottom:0;width:2px;background:#e9ecef;z-index:0}.timeline-item:last-child:before{display:none}.timeline-dot{width:24px;height:24px;border-radius:50%;border:3px solid #e9ecef;background:#fff;flex-shrink:0;z-index:1;position:relative;transition:all .3s ease}.timeline-item.completed .timeline-dot{background:linear-gradient(135deg,#66bb6a,#43a047);border-color:#43a047;box-shadow:0 0 0 4px #43a04733}.timeline-item.completed:before{background:linear-gradient(180deg,#66bb6a,#43a047)}.timeline-item.active .timeline-dot{background:linear-gradient(135deg,#42a5f5,#1e88e5);border-color:#1e88e5;animation:pulse-dot 2s infinite;box-shadow:0 0 0 4px #1e88e54d}@keyframes pulse-dot{0%,to{box-shadow:0 0 0 4px #1e88e54d}50%{box-shadow:0 0 0 8px #1e88e51a}}.timeline-item.active:before{background:linear-gradient(180deg,#66bb6a,#43a047)}.timeline-item.received .timeline-dot{background:linear-gradient(135deg,#66bb6a,#43a047);border-color:#43a047;box-shadow:0 0 0 8px #43a0474d;transform:scale(1.15)}.timeline-item.received .timeline-content h3{color:#43a047;font-weight:700;font-size:1.25rem}.timeline-item.received .timeline-content p{color:#43a047;font-weight:600}.timeline-item.delivered .timeline-dot{background:linear-gradient(135deg,#ff9800,#f57c00);border-color:#f57c00;box-shadow:0 0 0 8px #ff98004d;transform:scale(1.15)}.timeline-item.delivered .timeline-content h3{color:#f57c00;font-weight:700;font-size:1.25rem}.timeline-item.delivered .timeline-content p{color:#f57c00;font-weight:600}.timeline-item:not(.completed):not(.active) .timeline-dot{background:#fff;border-color:#dee2e6}.timeline-item:not(.completed):not(.active):before{background:#e9ecef}.timeline-content{flex:1;padding-top:0}.timeline-content h3{font-size:1.125rem;font-weight:600;color:#212529;margin:0 0 .375rem;transition:all .3s ease}.timeline-item.completed .timeline-content h3{color:#43a047}.timeline-item.active .timeline-content h3{color:#1e88e5}.timeline-content p{font-size:.9375rem;color:#6c757d;margin:0;line-height:1.5;transition:all .3s ease}@media (max-width: 768px){.timeline-item{gap:1rem}.timeline-item:before{left:11px}}
/*# sourceMappingURL=/cdn/shop/t/146/assets/track-order.css.map */