:root{--tatoz-blue: #1353A4;--tatoz-blue-dark: #0f4280;--tatoz-blue-light: #1a6bc4;--tatoz-yellow: #FFE14B;--tatoz-yellow-dark: #FFD918;--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--success: #10b981;--error: #ef4444;--warning: #f59e0b}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.track-order-container{min-height:100vh;background:var(--gray-50);display:flex;flex-direction:column}.track-order-header{background:#fff;border-bottom:1px solid var(--gray-200);padding:20px 0;position:sticky;top:0;z-index:100;box-shadow:0 1px 3px #0000000d}.header-content{max-width:1200px;margin:0 auto;padding:0 24px}.header-brand{display:flex;align-items:center;gap:16px}.header-logo{height:40px;width:auto;object-fit:contain}.header-text{display:flex;flex-direction:column;gap:2px}.header-title{font-size:24px;font-weight:700;color:var(--tatoz-blue);line-height:1.2;margin:0}.header-subtitle{font-size:14px;color:var(--gray-500);font-weight:400;margin:0}.main-content{flex:1;max-width:1200px;width:100%;margin:0 auto;padding:40px 24px}.search-container{display:flex;justify-content:center;margin-bottom:40px}.search-card{background:#fff;border:1px solid var(--gray-200);border-radius:12px;padding:48px;max-width:600px;width:100%;box-shadow:0 1px 3px #0000001a}.search-title{font-size:28px;font-weight:700;color:var(--gray-900);margin-bottom:8px;text-align:center}.search-description{font-size:16px;color:var(--gray-600);margin-bottom:32px;text-align:center}.search-form{width:100%}.input-group{display:flex;gap:12px}.search-input{flex:1;padding:14px 16px;border:1px solid var(--gray-300);border-radius:8px;font-size:16px;transition:all .2s;background:#fff}.search-input:focus{outline:none;border-color:var(--tatoz-blue);box-shadow:0 0 0 3px #1353a41a}.search-input:disabled{background:var(--gray-50);cursor:not-allowed}.search-button{padding:14px 32px;background:var(--tatoz-blue);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap}.search-button:hover:not(:disabled){background:var(--tatoz-blue-dark)}.search-button:disabled{opacity:.6;cursor:not-allowed}.error-container{margin-bottom:24px}.error-card{background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:20px}.error-title{font-size:16px;font-weight:600;color:var(--error);margin-bottom:8px}.error-message{font-size:14px;color:#991b1b}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px}.loading-spinner{width:48px;height:48px;border:4px solid var(--gray-200);border-top-color:var(--tatoz-blue);border-radius:50%;animation:spin .8s linear infinite}.loading-text{margin-top:16px;font-size:16px;color:var(--gray-600)}@keyframes spin{to{transform:rotate(360deg)}}.tracking-container{display:flex;flex-direction:column;gap:32px}.status-section{margin-bottom:8px}.status-card{background:#fff;border:1px solid var(--gray-200);border-radius:12px;padding:32px;box-shadow:0 1px 3px #0000001a}.status-badge{display:inline-block;padding:8px 16px;border-radius:6px;color:#fff;font-size:16px;font-weight:600;margin-bottom:24px}.progress-wrapper{margin-top:16px}.progress-bar{width:100%;height:8px;background:var(--gray-200);border-radius:4px;overflow:hidden;margin-bottom:8px}.progress-fill{height:100%;border-radius:4px;transition:width .6s ease}.progress-text{font-size:14px;color:var(--gray-600);text-align:right;font-weight:500}.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}.info-card{background:#fff;border:1px solid var(--gray-200);border-radius:8px;padding:20px;transition:all .2s}.info-card:hover{border-color:var(--tatoz-blue);box-shadow:0 2px 8px #1353a41a}.info-label{font-size:12px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.info-value{font-size:18px;font-weight:600;color:var(--gray-900)}.info-value.code{font-family:Monaco,Menlo,Courier New,monospace;font-size:16px;background:var(--gray-50);padding:8px 12px;border-radius:6px;display:inline-block}.section-header{margin-bottom:20px}.section-title{font-size:20px;font-weight:700;color:var(--gray-900);margin-bottom:4px}.section-subtitle{font-size:14px;color:var(--gray-600)}.timeline-section{background:#fff;border:1px solid var(--gray-200);border-radius:12px;padding:32px;box-shadow:0 1px 3px #0000001a}.timeline{position:relative}.timeline-item{display:flex;gap:20px;margin-bottom:32px;position:relative}.timeline-item:last-child{margin-bottom:0}.timeline-marker{display:flex;flex-direction:column;align-items:center;flex-shrink:0}.timeline-dot{width:12px;height:12px;border-radius:50%;border:3px solid white;box-shadow:0 0 0 2px currentColor;position:relative;z-index:2}.timeline-line{width:2px;flex:1;background:var(--gray-200);margin-top:4px;min-height:40px}.timeline-content{flex:1;padding-bottom:8px}.timeline-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px;flex-wrap:wrap}.timeline-status{font-size:16px;font-weight:600;color:var(--gray-900)}.timeline-source{font-size:11px;font-weight:600;padding:4px 10px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px}.timeline-time{font-size:13px;color:var(--gray-600);margin-bottom:8px}.timeline-location{font-size:14px;color:var(--gray-700);margin-bottom:4px}.timeline-message{font-size:14px;color:var(--gray-600);font-style:italic}.timeline-item.latest .timeline-content{background:var(--gray-50);padding:16px;border-radius:8px;border-left:3px solid var(--tatoz-blue)}.empty-state{background:#fff;border:1px solid var(--gray-200);border-radius:12px;padding:64px 32px;text-align:center}.empty-icon{width:64px;height:64px;margin:0 auto 16px;background:var(--gray-200);border-radius:50%}.empty-title{font-size:18px;font-weight:600;color:var(--gray-900);margin-bottom:8px}.empty-description{font-size:14px;color:var(--gray-600)}.address-section{background:#fff;border:1px solid var(--gray-200);border-radius:12px;padding:32px;box-shadow:0 1px 3px #0000001a}.address-card{padding-top:8px}.address-name{font-size:18px;font-weight:600;color:var(--gray-900);margin-bottom:4px}.address-phone{font-size:14px;color:var(--gray-600);margin-bottom:16px}.address-details{font-size:14px;color:var(--gray-700);line-height:1.6}.address-details>div{margin-bottom:4px}.location-section{background:#fff;border:1px solid var(--gray-200);border-radius:12px;padding:32px;box-shadow:0 1px 3px #0000001a}.location-card{padding-top:8px}.location-value{font-size:16px;font-weight:500;color:var(--gray-900);padding:16px;background:var(--gray-50);border-radius:8px}.track-order-footer{background:var(--gray-900);color:#fff;margin-top:80px;border-top:1px solid var(--gray-800)}.footer-content{max-width:1200px;margin:0 auto;padding:48px 24px;display:grid;grid-template-columns:2fr 3fr;gap:64px}.footer-brand{display:flex;flex-direction:column;gap:16px}.footer-logo{height:40px;width:auto;object-fit:contain;filter:brightness(0) invert(1)}.footer-tagline{font-size:14px;color:var(--gray-400);line-height:1.6}.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.footer-column h4{font-size:14px;font-weight:600;color:var(--tatoz-yellow);margin-bottom:16px;text-transform:uppercase;letter-spacing:.5px}.footer-column a{display:block;font-size:14px;color:var(--gray-400);text-decoration:none;margin-bottom:12px;transition:color .2s}.footer-column a:hover{color:#fff}.footer-bottom{max-width:1200px;margin:0 auto;padding:24px;border-top:1px solid var(--gray-800);text-align:center}.footer-bottom p{font-size:13px;color:var(--gray-500)}@media (max-width: 768px){.main-content{padding:24px 16px}.search-card{padding:32px 24px}.search-title{font-size:24px}.input-group{flex-direction:column}.search-button{width:100%}.info-grid{grid-template-columns:1fr}.footer-content{grid-template-columns:1fr;gap:40px}.footer-links{grid-template-columns:1fr;gap:32px}.status-card,.timeline-section,.address-section,.location-section{padding:24px}.timeline-item{gap:16px}}@media (max-width: 480px){.header-title{font-size:20px}.header-subtitle{font-size:12px}.search-card{padding:24px 20px}.status-card,.timeline-section,.address-section,.location-section{padding:20px}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}
