/* RaceRite mobile overrides - only applies on screens <= 768px wide.
   Desktop layout is untouched (style.css still controls it). */
/* Chip Return footer address block (all screen sizes) */
#footer p.chip-address { margin:6px 0 8px; font-weight:normal; }
#footer p.chip-warning { margin-top:0; }
#footer p span { display:table; margin-bottom:4px; }

@media (max-width: 768px) {
  html, body { height:auto; }
  body { font-size:15px; -webkit-text-size-adjust:100%; text-size-adjust:100%; }

  /* Fluid shell (drop the fixed 845px column and its background stripe) */
  .shell, .wrapper { width:auto; max-width:100%; background:#fff; min-height:0; height:auto !important; }
  .wrapper { padding:0 12px; }
  img { max-width:100%; height:auto; }

  /* Header + nav: logo on top, nav wraps into tap-friendly buttons */
  #header { padding-top:16px; height:auto; }
  #header h1#logo { float:none; margin:0 0 12px; }
  #header h1#logo a { float:none; display:block; }
  #header #navigation { clear:both; float:none; height:auto; padding:0 0 12px; }
  #header #navigation ul { height:auto; padding:0; display:flex; flex-wrap:wrap; gap:6px; }
  #header #navigation ul li, #header #navigation ul li.first { float:none; display:block; padding:0; flex:1 1 auto; }
  #header #navigation ul li a { float:none; display:block; text-align:center; font-size:13px; line-height:20px; padding:10px 8px; background:#ededed; border-radius:3px; }

  /* Main: content first, sidebar stacked below */
  #main { display:flex; flex-direction:column; }
  #main > .cl { display:none; }
  #main .content { order:2; float:none; display:block; width:auto; padding-top:8px; padding-bottom:16px; }
  #main .sidebar { order:1; float:none; display:block; width:auto; padding-top:4px; padding-bottom:6px; border-bottom:1px solid #ededed; margin-bottom:6px; }
  #main .sidebar .sidebar-box { margin-bottom:10px; }
  #main .sidebar > br { display:none; }
  #main .sidebar .fader { min-height:0; padding:10px 12px 0; }
  #main .sidebar .fader ul { height:auto !important; position:relative; }
  #main .sidebar .fader ul li { position:relative !important; }
  #main .sidebar .sidebar-box p { padding-left:12px; padding-right:12px; }
  #main .sidebar ul.sidebar-events { padding:10px 0 10px 4px; }
  #footer { order:3; float:none; display:block; width:auto; height:auto; margin:8px -12px 0; padding:18px 16px 36px; background:#ff281e; }
  #main .content p, .services-page #main .content p, .tech-page #main .content p,
  .contact-page #main .content p { font-size:15px; line-height:1.55; }
  #main .sidebar .fader p, #main .sidebar ul.sidebar-events li a { font-size:14px; line-height:1.45; }
  #main .sidebar ul.sidebar-events li span, #main .sidebar ul.sidebar-events li span.first { font-size:13px; }
  #footer p { font-size:15px; line-height:1.55; margin-bottom:12px; color:#000; }
  #footer p span { display:block; float:none; background:none; padding:0 0 6px; margin-bottom:6px; font-size:16px; letter-spacing:.5px; color:#fff; border-bottom:1px solid rgba(255,255,255,.5); }
  #footer p strong { background:none; padding-left:0; font-weight:bold; }
  #footer p.chip-address { margin:4px 0 14px; font-weight:normal; }
  #footer p.chip-warning { margin-bottom:0; }

  /* Homepage carousel: keep the 845px slides but scale them to the screen */
  #main .intro { order:0; overflow:hidden; zoom:0.88; }

  /* Calendar/results tables: scroll sideways inside the content column */
  .calendar-page table, .results-page table { margin-right:0; }
  #main .content .entry { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  #main .content table { min-width:560px; }
  .calendar-page table tr td, .results-page table tr td { font-size:14px; padding:9px 8px 9px 0; vertical-align:top; }
  #races tr[data-id] { cursor:pointer; }

  input, textarea, select { font-size:16px; max-width:100%; }
}
@media (max-width: 640px) { #main .intro { zoom:0.74; } }
@media (max-width: 540px) { #main .intro { zoom:0.6; } }
@media (max-width: 440px) { #main .intro { zoom:0.49; } }
@media (max-width: 400px) { #main .intro { zoom:0.43; } }
@media (max-width: 360px) { #main .intro { zoom:0.39; } }

/* Results "Select Year" dropdown (sidebar, all screen sizes) */
label.year-select-label { display:block; font-weight:bold; margin:0 0 4px; }
select.year-select { display:block; width:100%; max-width:184px; padding:3px 4px; font-size:12px; border:1px solid #bbb; background:#fff; color:#000; cursor:pointer; }
@media (max-width: 768px) {
  label.year-select-label { font-size:15px; margin-bottom:6px; }
  select.year-select { max-width:none; font-size:16px; padding:10px 8px; min-height:44px; border-radius:3px; }
}