/* public/css/theme.css
   Bootstrap 5 theme via CSS variables (no SCSS build needed)
   Adjust hex values anytime; all components update automatically.
*/

:root {
    /* Core brand */
    --bs-primary:       #2F6F3E; /* forest green */
    --bs-secondary:     #6B7D6B; /* muted sage */
    --bs-dark:          #1E2A22; /* deep green-black */
    --bs-light:         #F5F7F4; /* off-white with a touch of green */
  
    /* Supporting accents (optional) */
    --bs-info:          #1F6F78; /* creek teal */
    --bs-success:       #469F57; /* fresh grass */
    --bs-warning:       #E1A32A; /* warm amber */
    --bs-danger:        #B23A2B; /* earthy red */
  
    /* Text + backgrounds */
    --bs-body-color:    #1E2A22;
    --bs-body-bg:       #FFFFFF;
  
    /* Links */
    --bs-link-color:          var(--bs-primary);
    --bs-link-hover-color:    #275F35;
  
    /* Buttons, badges, etc. (stronger contrast) */
    --bs-primary-rgb: 47,111,62;
    --bs-dark-rgb:    30,42,34;
    --bs-light-rgb:   245,247,244;
  
    /* Optional elevated surfaces */
    --surface-1: #ffffff;
    --surface-2: #F0F4EF; /* pale sage panel */
    --bs-primary: #14532d;
    --bs-primary-rgb: 20, 83, 45;
  
    /* force button palette too */
    --bs-btn-primary-bg: #14532d;
    --bs-btn-primary-border-color: #14532d;
    --bs-btn-primary-hover-bg: #0f3f22;
    --bs-btn-primary-hover-border-color: #0f3f22;
  }
  
  /* Navbar presets */
  .navbar-brand {
    letter-spacing: .3px;
    font-weight: 600;
  }
  .navbar {
    box-shadow: 0 4px 16px rgba(0,0,0,.06);
  }
  
  /* Utility helpers for panels/sections */
  .section-surface {
    background: var(--surface-2);
    border-radius: 1rem;
  }
  
  /* Optional: dark scheme support (auto) 
  @media (prefers-color-scheme: light) {
    :root {
      --bs-body-bg:   #0f1512;
      --bs-body-color:#E6ECE8;
      --surface-1:    #111a16;
      --surface-2:    #0c1411;
    }
  }*/

/* Crossfade is provided by Bootstrap via .carousel-fade.
   This adds a subtle Ken Burns zoom on the active slide. */

   .carousel-item img {
    transform: scale(1.02);
    transition: transform 8s ease-in-out, opacity .8s ease-in-out;
    will-change: transform;
    transform-origin: center center;
  }
  
  /* When a slide is active, gently zoom further in */
  .carousel-fade .carousel-item.active img {
    transform: scale(1.08);
  }
  
  /* Reduce/disable motion for users who prefer less animation */
  @media (prefers-reduced-motion: reduce) {
    .carousel-item img {
      transition: none;
      transform: none !important;
    }
  }
  .badge.bg-primary-subtle {
    background: rgba(var(--bs-primary-rgb), .08) !important;
    border: 1px solid rgba(var(--bs-primary-rgb), .25) !important;
  }  

  /* Partners: colorful tiles */
.partners-grid {
    --tile-radius: 1rem;
  }
  
  .partner-tile {
    border: 1px solid rgba(0,0,0,.06);
    border-radius: var(--tile-radius);
    transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease, border-color .25s ease;
    box-shadow: 0 4px 14px rgba(0,0,0,.04);
    overflow: hidden;
    position: relative;
  }
  
  .partner-tile:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(0,0,0,.08);
  }
  
  /* Soft color system using HSL; each tile picks a different pastel
     via nth-child. Adjust the hues to taste. Keep high contrast for text. */
  .partner-tile:nth-child(6n+1) { background: hsl(140 35% 93%); border-color: hsl(140 25% 80% / .6); }
  .partner-tile:nth-child(6n+2) { background: hsl(190 35% 93%); border-color: hsl(190 25% 80% / .6); }
  .partner-tile:nth-child(6n+3) { background: hsl(40  55% 93%); border-color: hsl(40  45% 80% / .6); }
  .partner-tile:nth-child(6n+4) { background: hsl(280 35% 94%); border-color: hsl(280 25% 82% / .6); }
  .partner-tile:nth-child(6n+5) { background: hsl(10  55% 93%); border-color: hsl(10  45% 80% / .6); }
  .partner-tile:nth-child(6n+6) { background: hsl(220 35% 93%); border-color: hsl(220 25% 80% / .6); }
  
  .partner-name {
    color: var(--bs-dark);
    font-weight: 600;
    line-height: 1.2;
  }
  
  .partner-url {
    color: rgba(0,0,0,.55);
    font-size: .875rem;
  }
  
  .partner-chip {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: #fff;
    color: var(--bs-primary);
    border: 1px solid rgba(var(--bs-primary-rgb), .25);
    padding: .35rem .65rem;
    border-radius: 999px;
    font-weight: 600;
    font-size: .75rem;
    white-space: nowrap;
  }
  
  /* Simple external link arrow (SVG) that matches text color */
  .partner-link-icon {
    width: 1.1rem; height: 1.1rem; flex: 0 0 auto; opacity: .8;
  }
  
  @media (prefers-reduced-motion: reduce) {
    .partner-tile, .partner-tile:hover { transition: none; transform: none; }
  }
  
  .navbar .btn-outline-primary {
    border-radius: 999px;
    font-size: 0.9rem;
    transition: all 0.2s ease;
  }
  
  .navbar .btn-outline-primary:hover {
    background-color: var(--bs-primary);
    color: #fff;
  }

  /* Navbar button consistency */
.navbar .btn {
    border-radius: 999px;
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.2;
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
    transition: all 0.2s ease;
  }
  
  /* Hover & color polish */
  .navbar .btn-outline-light:hover {
    background-color: #fff;
    color: var(--bs-primary);
  }
  
  .navbar .btn-light:hover {
    background-color: var(--bs-body-bg, #f3f1ea);
    color: var(--bs-primary);
  }

  li.nav-item.mt-2.mt-lg-0 {
    margin-right: 7px;
  }

  /* TIMELINE */
  .timeline {
    border-left: 3px solid var(--bs-primary);
    position: relative;
    margin-left: 1rem;
    padding-left: 1.5rem;
  }

  .timeline-item {
    position: relative;
    margin-bottom: 2rem;
  }

  .timeline-item::before {
    content: "";
    position: absolute;
    left: -1.55rem;
    top: 0.4rem;
    width: 0.9rem;
    height: 0.9rem;
    background-color: var(--bs-primary);
    border-radius: 50%;
  }

  .timeline-item h5 {
    margin-bottom: 0.25rem;
  }

  .user-type .admin { 
    background-color:#B23A2B !important;
  }

  .user-type .volunteer { 
    background-color:#1F6F78 !important;
  }

input[type="checkbox"]#is_admin:checked, input[type="checkbox"]#email_is_bad:checked {
    background-color: #B23A2B !important;
    border-color:#6f241a !important;
}

.btn-primary {
    background-color: #094120 !important;
    border-color: #14532d !important;
  }
  
  .btn-primary:hover,
  .btn-primary:focus {
    background-color: #0f3f22 !important;
    border-color: #0f3f22 !important;
  }

.btn-primary:hover {
    background-color: #378418 !important;
}

  a {
    text-decoration: none;
    color: #bf820f;
}

#events,
#events .timeline {
  max-width: 100%;
  overflow-x: hidden;
}