/* MACSOM Public UI Step 4 — unified customer experience */
:root{--m-navy:#06182e;--m-navy2:#0a2b4d;--m-blue:#1674ea;--m-cyan:#47cce8;--m-ink:#14243b;--m-muted:#6b7b8f;--m-line:#e3eaf1;--m-soft:#f5f8fb;--m-white:#fff;--m-green:#20a866;--m-red:#d64545;--m-shadow:0 22px 60px rgba(6,24,46,.12)}
html{scroll-behavior:smooth}body{background:linear-gradient(180deg,#f7faff 0,#fff 440px)!important;color:var(--m-ink)!important;font-family:"Segoe UI",Arial,sans-serif!important;-webkit-font-smoothing:antialiased}
.navbar{background:rgba(6,24,46,.98)!important;color:#fff!important;border:0!important;box-shadow:0 10px 32px rgba(6,24,46,.16)!important;min-height:74px!important;position:relative;z-index:20}.navbar-inner,.navbar{padding-left:max(20px,calc((100% - 1180px)/2))!important;padding-right:max(20px,calc((100% - 1180px)/2))!important}.navbar-inner{min-height:74px!important}.navbar .logo,.navbar a.logo{color:#fff!important;font-weight:800!important;letter-spacing:.1px!important}.navbar a:not(.logo){color:#d9e7f7!important}.navbar a:hover{color:#74d8ed!important}.home-link{border:1px solid rgba(255,255,255,.2)!important;border-radius:9px!important;padding:9px 14px!important;background:rgba(255,255,255,.05)!important}
.container{width:min(1120px,calc(100% - 32px))!important;margin-left:auto!important;margin-right:auto!important}.form-container,.search-card,.search-box,.result,.shipment-card,.tracking-card,.details-card{border:1px solid var(--m-line)!important;border-radius:18px!important;box-shadow:var(--m-shadow)!important;background:#fff!important}.form-container,.search-card,.search-box{position:relative!important;overflow:hidden!important}.form-container:before,.search-card:before,.search-box:before{content:"";display:block;position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--m-blue),var(--m-cyan))}
.form-title h1,.search-card h1,.search-box h1{color:var(--m-navy)!important;letter-spacing:-.7px!important}.form-title p,.search-card>p,.search-box>p{color:var(--m-muted)!important}.form-title h1:first-letter,.search-card h1:first-letter,.search-box h1:first-letter{color:var(--m-blue)}
label{color:#41536a!important;font-weight:700!important;font-size:12px!important}input,select,textarea{border:1px solid #d6e0eb!important;border-radius:9px!important;background:#fbfcfe!important;color:var(--m-ink)!important;transition:.2s!important}input:focus,select:focus,textarea:focus{outline:none!important;border-color:#7eb5f5!important;box-shadow:0 0 0 3px rgba(22,116,234,.09)!important;background:#fff!important}button,.btn,.submit-btn{border-radius:9px!important;background:linear-gradient(135deg,var(--m-blue),#0d60c9)!important;color:#fff!important;border:0!important;font-weight:750!important;box-shadow:0 9px 20px rgba(22,116,234,.18)!important;transition:.2s!important}button:hover,.btn:hover,.submit-btn:hover{transform:translateY(-1px)!important;box-shadow:0 13px 27px rgba(22,116,234,.25)!important}
.error{border:1px solid #f2cccc!important;background:#fff5f5!important;color:#a72e2e!important;border-radius:10px!important}.success{border:1px solid #bfe6d1!important;background:#f0fbf5!important;color:#177747!important;border-radius:10px!important}.info,.notice{border-radius:10px!important;border:1px solid #cfe1f7!important;background:#f3f8ff!important}
.result,.shipment-card{margin-top:24px!important}.result h2,.shipment-card h2,.tracking-card h2{color:var(--m-navy)!important}.status,.badge,[class*="status-"]{border-radius:999px!important;font-weight:750!important}.timeline,.tracking-history{position:relative}.timeline-item,.history-item{border-color:var(--m-line)!important}
table{border-collapse:separate!important;border-spacing:0!important;overflow:hidden!important;border:1px solid var(--m-line)!important;border-radius:12px!important}th{background:#f3f7fc!important;color:#42546b!important;font-size:11px!important;letter-spacing:.4px!important}td{border-color:#edf1f5!important}.receipt{border:1px solid var(--m-line)!important;border-radius:18px!important;box-shadow:var(--m-shadow)!important;overflow:hidden!important;background:#fff!important}.receipt-header{background:linear-gradient(120deg,var(--m-navy),var(--m-navy2))!important;color:#fff!important;padding:30px!important}.receipt-header *{color:#fff!important}.company-name{font-weight:850!important;letter-spacing:-.5px!important}.action-bar{width:min(900px,calc(100% - 32px))!important;margin:28px auto 18px!important}.back-btn,.print-btn{border-radius:9px!important}.print-btn{background:var(--m-blue)!important;color:#fff!important}.back-btn{background:#fff!important;color:var(--m-navy)!important;border:1px solid var(--m-line)!important}
@media(max-width:700px){.navbar{min-height:66px!important}.navbar-inner{min-height:66px!important}.container{width:min(100% - 24px,1120px)!important}.form-container,.search-card,.search-box,.result,.receipt{border-radius:14px!important}.action-bar{width:calc(100% - 24px)!important}.navbar .logo{font-size:14px!important}.home-link{font-size:12px!important}.receipt-header{padding:22px!important}}
@media print{.navbar,.action-bar{display:none!important}.receipt{box-shadow:none!important;border:0!important}.receipt-header{-webkit-print-color-adjust:exact;print-color-adjust:exact}}

/* UI STEP 5 — final public consistency & accessibility polish */
html{scroll-behavior:smooth}body{overflow-x:hidden}button,a,input,select,textarea{font-family:inherit}button,a{transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,border-color .18s ease,color .18s ease}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(22,116,234,.28)!important;outline-offset:3px}.navbar{box-shadow:0 8px 30px rgba(6,24,46,.06)}.container{max-width:1180px}.alert,.error,.success,.error-box{border-radius:12px!important}.result,.search-box,.search-card,.receipt{box-shadow:0 18px 55px rgba(6,24,46,.08)}input,select,textarea{max-width:100%}table{width:100%}img,svg{max-width:100%}@media(max-width:640px){body{font-size:15px}.navbar-inner{min-height:68px}.container{width:min(100% - 28px,1180px)!important}.search-box,.search-card,.result{border-radius:14px!important}.info-grid{grid-template-columns:1fr!important}.action-bar{gap:8px;flex-wrap:wrap}.action-bar a,.action-bar button{flex:1;min-width:130px;text-align:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
