/* myflask/static/css/base.css */

/* Basic sitewide resets/styles */
body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  background-color: #f8f9fa;
  padding-top: 70px;  /* for fixed navbar space */
  padding-bottom: 70px; /* for fixed footer space */
}

/* Footer styling */
.footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  background-color: #e9ecef;
}


.footer .container {
  text-align: center;
}



/* Flash Messages container */
.flash-messages {
  position: fixed;
  top: 80px;
  right: 20px;
  z-index: 1050;
  width: 300px;
}

/* Button transitions */
.btn {
  transition: background-color 0.3s ease, border-color 0.3s ease;
}

/* Override form-label styles to prevent ellipsis */
label.form-label {
  width: auto !important;               /* Remove fixed width */
  white-space: normal !important;       /* Allow text to wrap */
  overflow: visible !important;         /* Show overflow */
  text-overflow: clip !important;       /* Disable ellipsis */
  display: block !important;            /* Change to block if necessary */
}


/* for my plan_modification page  */
@keyframes wiggle {
  0%, 100% { transform: rotate(-8deg);}
  50% { transform: rotate(8deg);}
}
#rocket-emoji.animated {
  animation: wiggle 0.7s infinite;
}


/* [PATCH 2025-10-26] make Bootstrap hamburger bars red */
.navbar-light .navbar-toggler {
  border-color: rgba(211,51,51,.25); /* subtle red border */
}
.navbar-light .navbar-toggler:focus {
  box-shadow: 0 0 0 .2rem rgba(211,51,51,.25);
}
/* override the default svg bars to red */
.navbar-light .navbar-toggler-icon{
  background-image:
    url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(211,51,51, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}