/* gotojourney.in — custom theme on top of Bootstrap 5 */
:root {
  --gj-primary: #0e4d64;
  --gj-primary-dark: #093647;
  --gj-accent: #ffb703;
  --gj-bg: #f5f8fa;
}

body { background: var(--gj-bg); font-family: "Segoe UI", system-ui, -apple-system, sans-serif; }

a { text-decoration: none; }
.gj-footer { background: orange; }
.gj-footer a { color: rgba(255,255,255,.75); }
.gj-footer a:hover { color: #fff; }

/* Top contact bar */
.gj-topbar { background: var(--gj-primary-dark); border-bottom: 1px solid rgba(255,255,255,.08); }
.gj-topbar a { color: rgba(255,255,255,.85); font-size: .85rem; }
.gj-topbar a:hover { color: var(--gj-accent); }
.gj-topbar a .bi { color: var(--gj-accent); }

/* Brand & footer logo */
.gj-brand-logo, .gj-footer-logo {
  object-fit: cover; border-radius: 50%; background: #fff;
  box-shadow: 0 0 0 2px rgba(255,255,255,.25);
}
.gj-brand-logo { height: 40px; width: 40px; }
.gj-footer-logo { height: 48px; width: 48px; }

/* Social icons */
.gj-social a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%;
  background: rgba(255,255,255,.12); color: #fff !important; font-size: .9rem;
  transition: background .15s ease, color .15s ease;
}
.gj-social a:hover { background: var(--gj-accent); color: #212529 !important; }
.gj-social a .bi { color: inherit; }

/* Navbar */
.gj-navbar { background: linear-gradient(90deg, var(--gj-primary-dark), var(--gj-primary)); }
.gj-navbar .btn-register { color: var(--gj-accent); font-weight: 600; }

/* Hero */
.gj-hero {
  background: linear-gradient(135deg, var(--gj-primary-dark) 0%, var(--gj-primary) 60%, #156a85 100%);
  color: #fff;
  padding: 4.5rem 0 5.5rem;
}
.gj-hero h1 { font-weight: 800; letter-spacing: -.5px; }
.gj-search-card {
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 .75rem 2rem rgba(9,54,71,.25);
}

/* Cards */
.gj-vehicle-card { border: 0; border-radius: .9rem; overflow: hidden; transition: transform .15s ease, box-shadow .15s ease; }
.gj-vehicle-card:hover { transform: translateY(-4px); box-shadow: 0 .6rem 1.4rem rgba(0,0,0,.12); }
.gj-vehicle-card img.gj-photo { height: 180px; object-fit: cover; width: 100%; background: #e9eef2; }

.badge-genuine {
  background: #e7f7ee; color: #0f7a3d; border: 1px solid #bce6cf;
  font-weight: 600; font-size: .75rem;
}
.gj-vcode { font-family: Consolas, monospace; font-size: .8rem; color: #6c757d; }

/* Sections */
.gj-section-title { font-weight: 700; color: var(--gj-primary-dark); }
.gj-feature-icon {
  width: 56px; height: 56px; border-radius: 50%;
  background: rgba(14,77,100,.08); color: var(--gj-primary);
  display: inline-flex; align-items: center; justify-content: center; font-size: 1.5rem;
}
.gj-step-number {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--gj-accent); color: #212529; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
}

/* Dashboard */
.gj-stat-card { border: 0; border-radius: .9rem; }
.gj-stat-card .stat-value { font-size: 1.9rem; font-weight: 800; }
.gj-sidebar .list-group-item.active { background: var(--gj-primary); border-color: var(--gj-primary); }

/* Buttons */
.btn-gj { background: var(--gj-primary); color: #fff; font-weight: 600; }
.btn-gj:hover { background: var(--gj-primary-dark); color: #fff; }
.btn-gj-accent { background: var(--gj-accent); color: #212529; font-weight: 700; }
.btn-gj-accent:hover { background: #e3a303; color: #212529; }

/* Star rating input */
.gj-star-input .bi { font-size: 1.5rem; cursor: pointer; color: #ced4da; }
.gj-star-input .bi.active { color: #ffb703; }

/* Tables */
.table-gj thead { background: var(--gj-primary); color: #fff; }

/* Misc */
.gj-notice { background: #fff8e6; border: 1px solid #ffe3a3; border-radius: .6rem; }
.gj-muted-box { background: #eef3f6; border-radius: .6rem; }
img.gj-profile-photo { width: 72px; height: 72px; object-fit: cover; border-radius: 50%; }
.gj-flash { box-shadow: 0 .25rem .75rem rgba(0,0,0,.08); }

@media (max-width: 575.98px) {
  .gj-hero { padding: 3rem 0 4rem; }
  .gj-hero h1 { font-size: 1.6rem; }
}
