/* CinesistDB Profile Card - Light/Dark Mode Variables */
:root {
  /* Light Mode Defaults */
  --cinesist-db-card-bg: #ffffff;
  --cinesist-db-card-border: #e0e0e0;
  --cinesist-db-card-text: #2a2a2a;
  --cinesist-db-tag-color: #d102d1; /* --brand-purple (light) */
  --cinesist-db-title-color: #1a1a1a; /* --flex-text-title (light) */
  --cinesist-db-meta-text: #555555; /* --flex-text-secondary (light) */
  --cinesist-db-badge-bg: #f0f0f0; /* --flex-gray-2 (light) */
  --cinesist-db-headshot-border: #d102d1; /* --brand-purple (light) */
  --cinesist-db-person-name: #1a1a1a; /* --flex-text-primary (light) */
  --cinesist-db-person-role: #555555; /* --flex-text-secondary (light) */
  --cinesist-db-cta-bg: #d102d1; /* --brand-purple (light) */
  --cinesist-db-cta-text: #ffffff; /* --contrast-1 (light) */
  --cinesist-db-powered-by-opacity: 0.7;
  --cinesist-db-powered-by-text: #555555; /* --flex-text-secondary (light) */
  --cinesist-db-powered-by-hover: #ff5500; /* --brand-orange (light) */
  --cinesist-db-link-hover-color: #ff5500; /* --brand-orange (light) */
  --cinesist-db-group-label: #777777;
}

/* Dark Mode Overrides */
[data-theme="dark"],
.light-scheme {
  --cinesist-db-card-bg: #0d1117;
  --cinesist-db-card-border: #30363d;
  --cinesist-db-card-text: #c9d1d9;
  --cinesist-db-tag-color: #ff5500; /* --brand-orange (dark) */
  --cinesist-db-title-color: #ffffff; /* --flex-text-title (dark) */
  --cinesist-db-meta-text: #8b949e; /* --flex-text-secondary (dark) */
  --cinesist-db-badge-bg: #21262d;
  --cinesist-db-headshot-border: #ff5500; /* --brand-orange (dark) */
  --cinesist-db-person-name: #ffffff; /* --flex-text-primary (dark) */
  --cinesist-db-person-role: #8b949e; /* --flex-text-secondary (dark) */
  --cinesist-db-cta-bg: #ff5500; /* --brand-orange (dark) */
  --cinesist-db-cta-text: #ffffff; /* --contrast-1 (dark) */
  --cinesist-db-powered-by-opacity: 0.5;
  --cinesist-db-powered-by-text: #8b949e; /* --flex-text-secondary (dark) */
  --cinesist-db-powered-by-hover: #d102d1; /* --brand-purple (dark) */
  --cinesist-db-link-hover-color: #d102d1; /* --brand-purple (dark) */
  --cinesist-db-group-label: #8b949e;
}

/* Target only links inside your specific ACF Block on hover */
.cinesist-db-profile-card-hover-block a:hover {
  color: var(--brand-orange-90) !important;
}

/* Layout Fixes */
.intel-personnel-grid {
  display: flex;
  gap: 10px; /* Space between Director column and Writer column */
  margin-bottom: 10px;
}

/* Make the individual dossiers more compact */
.mini-dossier {
  margin-bottom: 8px;
  gap: 8px;
}

.mini-dossier .name {
  font-size: 0.9rem;
  white-space: nowrap; /* Prevents long names from wrapping */
}

/* Ensure the cast grid also behaves */
.cast-grid,
.personnel-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 columns */
  gap: 5px;
}

.group-label {
  margin: 15px 0 8px 0; /* Tighten up margins */
  text-transform: uppercase;
  opacity: 0.8;
}

.cinesist-db-profile-card-wrapper {
  background: var(--flex-bg-color-2);
  border: 1px solid var(--brand-purple);
  border-top: 3px solid var(--brand-purple);
  border-radius: 8px;
  color: var(--cinesist-db-card-text);
  font-family: "Work Sans", sans-serif;
  overflow: hidden;
  margin: 2rem 0;
  display: flex; /* Use flexbox for the main wrapper */
  flex-direction: column; /* Stack inner content vertically */
  box-shadow: 5px 10px 20px 0px var(--shadow-7);
}
.cinesist-db-profile-card-wrapper a {
  text-decoration: none;
  text-decoration-line: none !important;
}
.cinesist-db-profile-card-wrapper a:hover {
  color: var(--brand-orange-90) !important;
  text-decoration: underline; /* Optional: adds an underline on hover */
}

/* New footer section for "Powered by" */
.cinesist-db-card-footer {
  padding: 15px 30px;
  border-top: 1px solid var(--cinesist-db-card-border);
  background: var(--cinesist-db-card-bg); /* Match card background or slightly different */
  text-align: right; /* Align to the right */
}

.cinesist-db-card-inner {
  display: flex;
  gap: 20px;
  padding: 20px;
}

.cinesist-db-card-visual {
  flex: 0 0 250px;
  background: var(--cinesist-db-card-bg);
}

.dossier-poster {
  width: 100%;
  height: 100% !important; /* Let the height be determined by the content side */
  border-radius: 5px;
  min-height: 375px;
  object-fit: cover;
  display: block;
}
.dossier-poster:hover {
  transition: filter 0.3s ease; /* Smooth transition for the filter */
  filter: brightness(1.2); /* Slightly brighten on hover */
}

.cinesist-db-card-intel {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: normal;
}

.intel-tag {
  color: var(--cinesist-db-tag-color);
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 2px;
}

.intel-title,
.intel-title a {
  margin: 5px 0 10px 0; /* Adjusted margin */
  font-size: 2rem;
  letter-spacing: -2.5px;
  line-height: 1;
  text-transform: uppercase;
  font-weight: 900;
}

.intel-title a {
  text-decoration: none !important;
}
.intel-title a:hover {
  text-decoration: underline !important;
  color: var(--brand-orange-90) !important;
}

.intel-meta {
  font-size: 14px;
  color: var(--cinesist-db-meta-text);
  margin-bottom: 20px;
}

.meta-item:not(:last-child):after {
  content: "•";
  margin: 0 10px;
}

.genre-badge {
  background: var(--cinesist-db-badge-bg);
  padding: 3px 7px;
  border-radius: 5px;
  font-size: 12px;
  margin-right: 8px;
  display: inline-flex;
  align-items: center;
  color: #dddddd;
  border-radius: 5px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s ease;
  overflow: hidden;
  box-shadow: var(--shadow-1);
}
.genre-badge a {
  padding: 3px 7px;
  border-radius: 5px;
  font-size: 12px;
  margin-right: 8px;
  text-decoration: none;
}

.group-label {
  display: block;
  font-size: 12px; /* Slightly larger for readability */
  color: var(--cinesist-db-group-label);
  margin: 20px 0 10px 0;
  letter-spacing: 1px;
}

.mini-dossier {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  border-radius: 6px;
  border-left: 3px solid var(--brand-purple-50);
  padding: 10px;
  background: var(--flex-gray-15);
}
/* Prevent the headshot from squishing when text is long */
.mini-dossier > a {
  flex-shrink: 0;
  display: flex; /* Ensures the link wraps the image perfectly */
  text-decoration: none;
}

.mini-headshot {
  width: 30px;
  height: 30px;
  border-radius: 50%; /* Circular headshots */
  object-fit: cover;
  border: 1px solid var(--cinesist-db-headshot-border);
}
.mini-headshot:hover {
  transition: filter 0.3s ease;
  filter: brightness(1.2);
}

.person-meta .name {
  display: block;
  font-weight: 700;
  color: var(--cinesist-db-person-name);
}
.person-meta .name a {
  color: var(--brand-purple);
  text-decoration: none;
}
.person-meta .name a:hover {
  color: var(--cinesist-db-link-hover-color);
}
.person-meta .role {
  font-size: 0.75rem;
  color: var(--cinesist-db-person-role);
}
.person-meta .role a {
  color: var(--cinesist-db-person-role);
  text-decoration: none;
}
.person-meta .role a:hover {
  color: var(--cinesist-db-link-hover-color);
}

.cinesist-db-cta-btn {
  background: var(--cinesist-db-cta-bg);
  color: var(--cinesist-db-cta-text) !important;
  padding: 12px 24px;
  border-radius: 4px;
  text-decoration: none;
  display: inline-block;
  margin-top: 30px;
  letter-spacing: -1px !important;
  line-height: 1;
  text-transform: uppercase !important;
  font-weight: 900 !important;
  font-size: 1.25rem !important;
}

.intel-footer {
  display: flex;
  gap: 20px;
  padding: 10px 20px 10px 20px;
  background: var(--flex-gray-1);
}

.powered-by {
  font-size: 15px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 5px;
  letter-spacing: -0.5px;
  line-height: 1;
  font-weight: 900;
  text-decoration: none; /* Remove underline from the link */
  color: var(--cinesist-db-powered-by-text);
  opacity: var(--cinesist-db-powered-by-opacity);
  transition: all 0.2s ease;
}
.powered-by-link {
  text-decoration: none; /* Ensure the link itself doesn't have an underline */
}
.powered-by-link:hover .powered-by {
  opacity: 1; /* Full opacity on hover */
  color: var(--cinesist-db-powered-by-hover); /* Change text color on hover */
}
.powered-by-link:hover .powered-by img {
  filter: brightness(1.2); /* Slightly brighten logo on hover */
}
.powered-by img {
  width: 100px;
  height: auto;
}