/*
Theme Name: Ashe Child
Template: ashe
Version: 1.0
*/

.film-page-container {
  padding: 20px;
  background-color: #f4f4f4;
}

.film-poster {
  text-align: center;
  margin-bottom: 20px;
}

.film-poster img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
}

.film-details {
  background-color: #fff;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.film-details h1 {
  font-size: 2rem;
  margin-bottom: 10px;
}

.film-details p {
  font-size: 1.1rem;
}



.film-poster {
  display: flex;
  justify-content: center;
  margin-bottom: 1.5em;
}

.film-poster img {
  width: 100%;
  max-width: 300px;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
}


.film-title {
  text-align: center;
  font-size: 2.5rem;
  font-weight: 700;
  color: #111;
  margin-bottom: 1em;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
  letter-spacing: 0.5px;
}

.film-details {
  color: #f0f0f0; /* Brightens up the text */
}

.film-details p strong {
  color: #ffffff; /* Bold labels should really stand out */
}

.film-details a {
  color: #ffc107; /* Matches your existing bright gold link color */
}

.film-details a:hover {
  color: #ffdd57;
}


body.single-film {
  background-color: #1e1e1e !important;
}

/* Target any potential outer wrapper */
body.single-film .container,
body.single-film .site-main,
body.single-film .main-content,
body.single-film .content-area,
body.single-film .entry-content,
body.single-film .main-container {
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* Remove background from the theme's default post wrapper */
body.single-film .post,
body.single-film article,
body.single-film .hentry {
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}


.film-details {
  padding: 1.5em;
  background: #2a2a2a;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

.film-details p strong {
  color: #ffffff;
}

.film-page-container,
.film-wrapper {
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}






/* Film page CSS */
.film-grid-wrapper {
  padding: 2em;
  text-align: center;
  background-color: #1e1e1e;
}

.film-grid-title {
  font-size: 2rem;
  color: #fff;
  margin-bottom: 1em;
}

.film-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1.5em;
  max-width: 1200px;
  margin: 0 auto;
}

.film-grid-item img {
  width: 100%;
  border-radius: 8px;
  transition: transform 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

.film-grid-item img:hover {
  transform: scale(1.03);
}

.film-grid-item {
  text-align: center;
}

.film-grid-caption {
  margin-top: 0.5em;
  font-size: 1.1rem;   /* Increased from 0.95rem */
  font-weight: 600;
  color: #f0f0f0;
  line-height: 1.4;
}

.film-grid-caption:hover {
  color: #ffc107;
}

@media (max-width: 600px) {
  .film-grid-caption {
    font-size: 1rem;
  }
}

.film-search-form {
  margin-bottom: 2em;
  text-align: center;
}

.film-search-form input[type="search"] {
  padding: 0.5em;
  font-size: 1rem;
  width: 250px;
  border-radius: 6px;
  border: 1px solid #ccc;
}

.film-search-form button {
  padding: 0.5em 1em;
  font-size: 1rem;
  margin-left: 0.5em;
  background-color: #ffc107;
  border: none;
  border-radius: 6px;
  color: #000;
  cursor: pointer;
}

.film-search-form button:hover {
  background-color: #ffdd57;
}


.search-results-wrapper {
  padding: 2em;
  text-align: center;
  background-color: #1e1e1e;
}


body.search .film-grid-wrapper {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

.search-title {
  font-size: 2rem;
  color: #fff;
  margin-bottom: 1em;
}

.search-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1.5em;
  max-width: 1200px;
  margin: 0 auto;
}

.film-grid-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.film-grid-item img {
  width: 100%;
  max-width: 180px;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  margin-bottom: 0.5em;
}

.film-grid-caption {
  font-size: 1.1rem;
  font-weight: 600;
  color: #f0f0f0;
  line-height: 1.4;
  max-width: 180px;
}





/* --------- General Layout --------- */
.page section {
  max-width: 900px;
  margin: 0 auto;
  padding: 1.5rem 1rem;
  text-align: center;
}

.page .entry-title {
  display: none; /* hides the default "Home" title */
}

/* --------- Headings --------- */
.page section h1 {
  font-size: 2rem;
  margin-bottom: 0.5rem;
}

.page section h2 {
  font-size: 1.6rem;
  margin-bottom: 0.75rem;
}

/* --------- Paragraph Styling --------- */
.page section p {
  line-height: 1.5;
  font-size: 1rem;
  margin-bottom: 0.75rem;
}

/* --------- Buttons --------- */
.page a.button-link,
.page section a[href^="/"],
.page section a[href^="http"] {
  display: inline-block;
  margin-top: 0.5rem;
  padding: 0.6rem 1.2rem;
  font-size: 1rem;
  background-color: #0073aa;
  color: white;
  border-radius: 6px;
  text-decoration: none;
  transition: background-color 0.3s ease;
}

.page section a:hover {
  background-color: #005f8d;
}

/* --------- Featured Film Grid --------- */
.film-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem;
  margin-top: 1rem;
}

.film-grid a {
  text-decoration: none;
  background: none !important;
  padding: 0;
  color: inherit;
  width: 150px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.film-grid img {
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s ease;
}

.film-grid img:hover {
  transform: scale(1.05);
}

.film-grid p {
  margin: 0.5rem 0 0;
  font-size: 0.95rem;
  text-align: center;
}

/* Hide featured/sticky post sections on the homepage */
.home .featured-post,
.home .sticky,
.home .hero-post,
.home .post-featured,
.home .entry-featured,
.home .entry.sticky {
  display: none !important;
}





.psych-concept-cloud {
  text-align: center;
  margin: 3em auto;
  padding: 1em;
}

.psych-concept-cloud h2 {
  font-size: 1.8rem;
  margin-bottom: 1em;
  color: #fff;
}

.tagcloud a {
  background-color: #444 !important;
  color: #fff !important;
  padding: 0.4em 0.6em;
  margin: 0.3em;
  text-decoration: none;
  display: inline-block;
  border-radius: 4px;
  transition: background-color 0.3s ease;
}

.tagcloud a:hover {
  background-color: #ff6600 !important;
}


/* Header image positioning */
#page-header .entry-header {
  background-size: 100% auto !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
}