/* Ford Garages — light, mobile-first social theme */
:root {
  --fg-violet: #6d28d9;
  --fg-magenta: #d629a8;
  --fg-coral: #ff5b5f;
  --fg-orange: #ff9f1c;
  --fg-ink: #182033;
  --fg-muted: #6f7481;
  --fg-surface: #ffffff;
  --fg-canvas: #fbfafc;
  --fg-border: #eeeaf3;
  --fg-gradient: linear-gradient(135deg, var(--fg-violet) 0%, var(--fg-magenta) 38%, var(--fg-coral) 67%, var(--fg-orange) 100%);
}

body { background: var(--fg-canvas); color: var(--fg-ink); }
.main-header { background: rgba(255,255,255,.94); border-bottom: 1px solid var(--fg-border); box-shadow: 0 2px 18px rgba(33,20,62,.04); backdrop-filter: blur(16px); }

.logo.fg-brand { display: inline-flex; align-items: center; gap: 9px; color: var(--fg-ink); font-family: Poppins, sans-serif; font-size: 18px; font-weight: 700; letter-spacing: -.6px; text-decoration: none; white-space: nowrap; }
.fg-brand__icon { width: 34px; height: 34px; border-radius: 10px; object-fit: cover; flex: 0 0 auto; }
.fg-brand__name { background: var(--fg-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; }

.card, .dropdown-menu, .content-tabs { border: 1px solid var(--fg-border); border-radius: 16px; box-shadow: 0 8px 28px rgba(38,24,67,.055); }
.card-header { background: transparent; border-bottom-color: var(--fg-border); font-weight: 600; }
.form-control, .form-select { border-color: #e7e2ec; border-radius: 12px; }
.form-control:focus, .form-select:focus { border-color: var(--fg-magenta); box-shadow: 0 0 0 .22rem rgba(214,41,168,.13); }

.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active { border: 0; background: var(--fg-gradient); box-shadow: 0 8px 16px rgba(214,41,168,.20); }
.btn-primary { border-radius: 12px; font-weight: 600; }
.text-primary, a { color: var(--fg-violet); }
a:hover { color: var(--fg-magenta); }
.bg-primary { background: var(--fg-gradient) !important; }

.side-nav li.active a, .side-nav li a:hover { color: var(--fg-violet); background: linear-gradient(90deg, rgba(109,40,217,.09), rgba(255,91,95,.05)); border-radius: 10px; }
.side-nav li.active a:before { background: var(--fg-gradient); border-radius: 0 4px 4px 0; }
.post, .post .post-body, .publisher { border-color: var(--fg-border); }
.story-item .story-avatar, .story-avatar { padding: 2px; background: var(--fg-gradient); }
.post .post-footer, .post .post-actions { border-color: var(--fg-border); }

.fg-gradient-border { position: relative; border: 0 !important; background: linear-gradient(var(--fg-surface), var(--fg-surface)) padding-box, var(--fg-gradient) border-box; border: 1.5px solid transparent !important; }
.fg-splash { min-height: 100vh; display: grid; place-items: center; color: #fff; background: var(--fg-gradient); }
.fg-splash img { width: min(42vw, 180px); filter: drop-shadow(0 14px 22px rgba(54,15,72,.18)); }

/* Ford Garages home layout */
.ford-newsfeed-layout { max-width: 1380px; }
.ford-newsfeed-layout > .row { align-items: flex-start; }
.ford-newsfeed-layout .main-side-nav-card { border-radius: 22px; border-color: #ece5f2; box-shadow: 0 14px 34px rgba(46, 20, 82, .06); overflow: hidden; }
.ford-newsfeed-layout .main-side-nav-card .card-body { padding: 15px 12px; }
.ford-newsfeed-layout .main-side-nav li > a,
.ford-newsfeed-layout .main-side-nav > a { min-height: 43px; border-radius: 12px; margin: 2px 0; padding: 10px 12px; color: #303344; font-weight: 500; }
.ford-newsfeed-layout .main-side-nav li.active > a,
.ford-newsfeed-layout .main-side-nav li > a:hover,
.ford-newsfeed-layout .main-side-nav > a:hover { background: linear-gradient(90deg, rgba(109,40,217,.12), rgba(255,159,28,.08)); color: var(--fg-violet); }
.ford-newsfeed-layout .main-side-nav li.active > a:before { background: var(--fg-gradient); border-radius: 4px; }
.ford-newsfeed-layout .stories-wrapper { padding-top: 6px; }
.ford-newsfeed-layout .story-item .story-avatar,
.ford-newsfeed-layout .story-avatar { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #d629a8; }
.ford-newsfeed-layout .publisher,
.ford-newsfeed-layout .post { border: 1.5px solid transparent; background: linear-gradient(var(--fg-surface), var(--fg-surface)) padding-box, var(--fg-gradient) border-box; box-shadow: 0 12px 28px rgba(57, 27, 87, .06); border-radius: 20px; overflow: hidden; }
.ford-newsfeed-layout .publisher { margin-top: 14px; }
.ford-newsfeed-layout .post { margin-bottom: 16px; }
.ford-newsfeed-layout .post .post-footer,
.ford-newsfeed-layout .post .post-actions { border-color: rgba(214,41,168,.15); }
.ford-home-rail { display: grid; gap: 14px; margin-bottom: 16px; }
.ford-rail-card { border: 1.5px solid transparent; border-radius: 20px; padding: 15px 17px; background: linear-gradient(#fff,#fff) padding-box, var(--fg-gradient) border-box; box-shadow: 0 10px 26px rgba(57, 27, 87, .055); }
.ford-rail-card__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; text-transform: uppercase; font-size: 12px; font-weight: 700; letter-spacing: .03em; color: #292539; }
.ford-rail-card__head span:first-child i { color: var(--fg-violet); margin-right: 7px; font-size: 14px; }
.ford-rail-card__head a { color: #777282; font-size: 11px; font-weight: 500; text-transform: none; text-decoration: none; }
.ford-rail-card__head a:hover { color: var(--fg-magenta); }
.ford-rail-card__empty { color: #656171; font-size: 13px; line-height: 1.55; margin: 0 0 12px; }
.ford-rail-card__action { display: inline-flex; align-items: center; gap: 8px; color: var(--fg-violet); font-size: 13px; font-weight: 700; text-decoration: none; }
.ford-rail-card__action:hover { color: var(--fg-magenta); }
.ford-rail-card__soon { border-radius: 999px; background: #f3eef8; color: #756d80; padding: 3px 8px; font-size: 10px; font-weight: 600; text-transform: none; }

@media (min-width: 992px) {
  .ford-newsfeed-layout > .row > .sg-offcanvas-sidebar { position: sticky; top: 92px; }
  .ford-newsfeed-layout .js_sticky-sidebar { position: sticky; top: 92px; }
}

@media (max-width: 767.98px) {
  body { background: #fff; }
  .main-header { position: sticky; top: 0; z-index: 1040; }
  .logo.fg-brand { font-size: 16px; gap: 7px; }
  .fg-brand__icon { width: 30px; height: 30px; border-radius: 9px; }
  .card, .content-tabs { border-radius: 14px; box-shadow: 0 5px 18px rgba(38,24,67,.045); }
  .post { border-radius: 0; border-left: 0; border-right: 0; }
  .btn-primary { min-height: 42px; }
  .ford-newsfeed-layout { margin-top: 10px; }
  .ford-newsfeed-layout .main-side-nav-card { border-radius: 16px; }
  .ford-newsfeed-layout .post, .ford-newsfeed-layout .publisher { border-radius: 15px; }
}