input.custom-input,
textarea.custom-input,
select.custom-input {
    color: #000 !important;           /* black text */
    background-color: #fff !important; /* white background */
    border-color: #ccc !important;     /* optional: gray border */
}

#add-news-form label,
#add-news-form input,
#add-news-form textarea {
    color: #000 !important;
    background-color: #fff !important;
    border-color: #ccc !important;
}

/* Add News Form Styling */
#add-news-form {
    background-color: #fff;     /* white background */
    padding: 20px;              /* spacing inside form */
    border-radius: 5px;         /* rounded corners */
}

/* Ensure labels and text are readable */
#add-news-form label,
#add-news-form input,
#add-news-form textarea {
    color: #000 !important;     /* black text */
    background-color: #fff !important; /* white background for inputs */
}

/* Optional: make file input text black */
#add-news-form .form-control-file {
    color: #000 !important;
}

/* Force all text in Add News Form to be black */
#add-news-form, 
#add-news-form label, 
#add-news-form input, 
#add-news-form textarea, 
#add-news-form select {
    color: #000 !important;           /* black text */
    background-color: #fff !important; /* white background */
}

/* Optional: make placeholder text black too */
#add-news-form ::placeholder {
    color: #000 !important;
}

/* File input text */
#add-news-form .form-control-file {
    color: #000 !important;
}

/* Force all text in Add News Form to be visible */
#add-news-form,
#add-news-form label,
#add-news-form input,
#add-news-form textarea,
#add-news-form select {
    color: #000 !important;           /* black text */
    background-color: #fff !important; /* white background */
    border-color: #ccc !important;    /* optional: light gray border */
}

/* Placeholder text color */
#add-news-form ::placeholder {
    color: #000 !important;
}

/* File input text */
#add-news-form .form-control-file {
    color: #000 !important;
}

/* Breaking News Layout */
#home {
    display: flex;
    align-items: flex-start;  /* text aligns with top of image */
    gap: 20px;                /* space between image and text */
}

.breaking-news {
    margin-top: 15px;
    margin-bottom: 15px;
}

.breaking-news-img {
    max-width: 100%;
    height: auto;
/*border-radius: 6px; /* optional for nicer look */
    border-radius: auto; /* optional for nicer look */
}

.breaking-news-text {
    display: flex;
    align-items: center; /* vertical alignment */
}

.breaking-news-text h3 {
    margin-top: 0; /* tighter spacing */
}

/* Put this at the very top of custom.css to avoid being skipped if something below breaks */
.announcement-container {
  background-color: #f301934 !important; /* light purple */
  padding: 25px;
  border-radius: 10px;
}

/* Ensure the container wraps floated children, just in case */
.announcement-container::after {
  content: "";
  display: block;
  clear: both;
}


/*Articles */
.article-wrap {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  text-align: left;        /* overrides any parent text-center */
}

.article-img {
  flex: 0 0 320px;         /* fixed column for image */
  max-width: 40vw;         /* prevents it from getting too huge */
  height: auto;
  margin: 0;               /* kills any global img centering */
}

.article-body {
  flex: 1 1 auto;
}

/* Mobile: stack vertically */
@media (max-width: 768px) {
  .article-wrap {
    flex-direction: column;
  }
  .article-img {
    width: 100%;
    max-width: 100%;
  }
}

/*Article content */
.article-thumb {
  float: left;
  width: 320px;           /* adjust to taste */
  max-width: 40%;
  height: auto;
  margin: 0 16px 12px 0;  /* space between image and text */
}

.article-content::after {
  content: "";
  display: table;
  clear: both;            /* clearfix so footer/next content doesn't wrap */
}

.article-content,
.article-body {
  text-align: left;       /* override any centered parent */
}

.posts-list {
    display: block !important;
}

/* Ensure dashboard always has some height */
.dashboard-container {
    min-height: 70vh; /* 70% of viewport height */
    display: flex;
    flex-direction: column;
}

/* Style empty state */
.dashboard-container .card-body {
    padding: 40px 20px;
    font-size: 1.1rem;
}

/* Optional: subtle background for the whole dashboard */
.dashboard-container {
    background: #f9f9ff; /* light shade of purple/gray */
    border-radius: 12px;
    padding: 20px;
}





/*.nugget-quote {
/*    font-size: 18px;         /* keeps 18px font */
/*    font-style: italic;      /* italic like original */
/*    font-family: inherit;    /* uses site font instead of monospace */
/*    line-height: 1.5;        /* spacing between lines for stanzas */
/*    white-space: pre-wrap;   /* preserves line breaks and wraps long lines */
/*    margin: 0;               /* remove extra pre default margin */
}