/*
Theme Name: Alexco Shipment
Theme URI: https://alexco.example
Author: Alexco / ChatGPT
Description: Custom theme for Alexco Shipping & Delivery — orange/white/black branding, tracking, client dashboard, shipment filters, mobile nav, WhatsApp floating button.
Version: 1.0.1
Text Domain: alexco-shipment
*/

:root{
  --alexco-orange:#ff7a00;
  --alexco-black:#111111;
  --alexco-white:#ffffff;
  --alexco-gray:#f4f4f6;
  --alexco-muted:#6b7280;
  --alexco-success:#16a34a;
  --alexco-warning:#f59e0b;
  --alexco-danger:#ef4444;
  --alexco-primary:var(--alexco-orange);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,Arial; color:#1f2937; background:#fff;
}

/* Header / Nav */
.alx-header{position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid #eee}
.alx-wrap{max-width:1200px; margin:0 auto; padding:0 16px}
.alx-row{display:flex; align-items:center; justify-content:space-between; gap:12px}
.alx-brand{display:flex; align-items:center; gap:10px; padding:12px 0}
.alx-logo{width:40px; height:40px; border-radius:8px; background:linear-gradient(135deg,var(--alexco-orange),#ffa64d)}
.alx-title{font-weight:800; letter-spacing:.2px}
.alx-tag{font-size:12px; color:var(--alexco-muted); margin-top:-6px}

.alx-nav a{display:inline-block; padding:10px 12px; text-decoration:none; color:#374151; border-radius:8px}
.alx-nav a:hover{background:#f6f6f7}
.alx-cta{padding:10px 14px; border-radius:10px; background:var(--alexco-primary); color:#fff !important; font-weight:700}
.alx-auth{display:flex; align-items:center; gap:10px}
.alx-auth a{color:#374151; text-decoration:none}

/* Mobile menu */
.alx-burger{display:none; background:none; border:0; padding:10px}
.alx-mobile{display:none; border-top:1px solid #eee; padding:8px 0}
.alx-mobile a{display:block; padding:10px; text-decoration:none; color:#374151}
@media(max-width:900px){
  .alx-nav{display:none}
  .alx-burger{display:block}
}

/* Hero */
.alx-hero{background:linear-gradient(135deg,#fff7f0,#fff); border-bottom:1px solid #f1f1f1}
.alx-hero-inner{padding:40px 0}
.alx-hero h1{margin:0 0 8px; font-size:32px}
.alx-hero p{margin:0 0 18px; color:#4b5563}
.alx-hero .alx-actions{display:flex; gap:10px; flex-wrap:wrap}
.button{display:inline-block; border:1px solid var(--alexco-black); padding:10px 14px; border-radius:10px; text-decoration:none; color:var(--alexco-black); font-weight:600}
.button.primary{background:var(--alexco-primary); border-color:var(--alexco-primary); color:#fff}

/* Cards / Table-ish */
.grid{display:grid; gap:16px}
@media(min-width:800px){ .grid.cols-3{grid-template-columns:repeat(3,1fr)} }
.card{border:1px solid #eee; border-radius:16px; padding:16px; background:#fff}
.card h3{margin:0 0 8px}
.meta{display:flex; flex-wrap:wrap; gap:10px; color:#6b7280; font-size:14px}
.badge{display:inline-block; padding:4px 10px; border-radius:999px; font-size:12px; font-weight:700; background:#eef2ff; color:#3730a3}
.badge.success{background:#ecfdf5; color:#166534}
.badge.warning{background:#fff7ed; color:#9a3412}
.badge.danger{background:#fef2f2; color:#991b1b}
.badge.info{background:#eff6ff; color:#1e40af}

/* Filters */
.filters{display:grid; gap:10px; margin:16px 0}
@media(min-width:800px){ .filters{grid-template-columns:repeat(5,1fr)} }
.input, select{width:100%; padding:10px 12px; border:1px solid #ddd; border-radius:10px}

/* Shipment detail */
.detail{display:grid; gap:12px}
.detail .row{display:flex; justify-content:space-between; border-bottom:1px dashed #eee; padding:6px 0}
.detail .row label{color:#6b7280}

/* Footer */
.alx-footer{margin-top:40px; background:#0f0f0f; color:#ddd; padding:32px 0}
.alx-footer a{color:#fff; text-decoration:none}
.alx-footer .cols{display:grid; gap:16px}
@media(min-width:800px){ .alx-footer .cols{grid-template-columns:2fr 1fr 1fr} }
.alx-footer .credits{margin-top:18px; font-size:13px; color:#aaa}

/* WhatsApp Floating Button */
.wa-float{
  position:fixed; right:16px; bottom:16px; z-index:60;
  width:54px; height:54px; border-radius:999px;
  background:var(--alexco-primary); display:flex; align-items:center; justify-content:center;
  color:#fff; text-decoration:none; font-weight:800; box-shadow:0 10px 30px rgba(0,0,0,.1);
}

/* Simple slider */
.slider{position:relative; overflow:hidden; border-radius:16px; border:1px solid #eee}
.slide-track{display:flex; transition:transform .6s ease}
.slide{min-width:100%; padding:40px; background:#fff}
.slide h3{margin:0 0 8px}

/* Utilities */
.mt-2{margin-top:8px}
.mt-3{margin-top:12px}
.mt-4{margin-top:16px}
.center{display:flex; align-items:center; justify-content:center}
.hidden{display:none}