/* My News Page Styles */


.my-news-header,
.my-news-footer {
  background-color: #364C66;
  color: #ffffff;
}

.my-news-footer a {
  color: rgba(255, 255, 255, 0.75);
  transition: color 0.15s ease-in-out;
}

.my-news-footer a:hover {
  color: #ffffff;
}

/* Newsroom template palette. Scoped to avoid changing My News pages. */
.newsroom-template {
  --newsroom-accent: #99b8b2;
  --newsroom-accent-hover: #8aa9a3;
  --newsroom-border: #c7d7d4;
  --newsroom-muted: #c2d4d1;
  --newsroom-muted-hover: #b8cdc9;
  --newsroom-text-muted: #1e293b;
  --newsroom-border-muted: #c7d7d4;
}

.newsroom-template .newsroom-site-header,
.newsroom-template .newsroom-site-footer,
.newsroom-template .newsroom-share-button {
  background-color: var(--newsroom-accent);
}

.newsroom-template .newsroom-share-button:hover {
  background-color: var(--newsroom-accent-hover);
}

.newsroom-template .newsroom-section {
  border-color: var(--newsroom-border);
}

.newsroom-template .newsroom-tab-button.bg-blue-600,
.newsroom-template [id^="pagination-container-newsroom-"] .bg-blue-600,
.newsroom-template button.bg-blue-600 {
  background-color: var(--newsroom-accent) !important;
}

.newsroom-template .newsroom-tab-button.bg-blue-600:hover,
.newsroom-template [id^="pagination-container-newsroom-"] .bg-blue-600:hover,
.newsroom-template button.bg-blue-600:hover {
  background-color: var(--newsroom-accent-hover) !important;
}

.newsroom-template .newsroom-tab-button.bg-gray-100 {
  background-color: var(--newsroom-muted) !important;
  color: var(--newsroom-text-muted) !important;
}

.newsroom-template .newsroom-tab-button.bg-gray-100:hover {
  background-color: var(--newsroom-muted-hover) !important;
}

/* Newsletter language tabs */
.newsroom-template .newsletter-lang-tab.bg-blue-600 {
  background-color: var(--newsroom-accent) !important;
}

.newsroom-template .newsletter-lang-tab.bg-blue-600:hover {
  background-color: var(--newsroom-accent-hover) !important;
}

.newsroom-template .newsletter-lang-tab.bg-gray-100 {
  background-color: var(--newsroom-muted) !important;
  color: var(--newsroom-text-muted) !important;
}

.newsroom-template .newsletter-lang-tab.bg-gray-100:hover {
  background-color: var(--newsroom-muted-hover) !important;
}

.newsroom-template .newsletter-card-bg-fallback {
  background-color: var(--newsroom-accent);
}

.newsroom-template .type-indicator-company,
.newsroom-template .type-indicator-topic,
.newsroom-template .type-indicator-city,
.newsroom-template .type-indicator-region,
.newsroom-template .type-indicator-newsletter {
  background-color: var(--newsroom-accent);
  color: #ffffff;
}

.newsroom-template .newsletter-signup-btn {
  background-color: var(--newsroom-accent);
}

.newsroom-template .newsletter-signup-btn:hover {
  background-color: var(--newsroom-accent-hover);
}

/* Button transitions and interactions */
button {
  transition: all 0.15s ease-in-out;
}

button:active {
  transform: scale(0.95);
}

button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

button:disabled:hover {
  background-color: inherit;
  transform: none;
}

.my-news-tooltip {
  position: relative;
  overflow: visible;
}

.my-news-tooltip::before,
.my-news-tooltip::after {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  transition: opacity 0.15s ease-in-out;
  z-index: 50;
}

.my-news-tooltip::before {
  border: 6px solid transparent;
  border-top-color: #111827;
  content: "";
  left: 50%;
  top: -8px;
  transform: translateX(-50%);
}

.my-news-tooltip::after {
  background-color: #111827;
  border-radius: 4px;
  bottom: calc(100% + 8px);
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.12);
  color: #ffffff;
  content: attr(data-tooltip);
  font-size: 12px;
  font-weight: 400;
  left: 50%;
  line-height: 1.35;
  max-width: 260px;
  min-width: 180px;
  padding: 8px 10px;
  text-align: left;
  text-transform: none;
  transform: translateX(-50%);
  white-space: normal;
}

.my-news-tooltip:hover::before,
.my-news-tooltip:hover::after,
.my-news-tooltip:focus::before,
.my-news-tooltip:focus::after {
  opacity: 1;
}

/* Hover effects for entries are handled by Tailwind classes (.hover:bg-gray-50) */

/* Drag and drop ghost class styling */
.sortable-ghost {
  opacity: 0.5;
}

/* Additional pagination button styling */
.pagination-button {
  transition: all 0.15s ease-in-out;
}

.pagination-button:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Newsletter Card Layout Styles */
.newsletter-card {
  min-height: 200px;
}

.newsletter-card-bg-with-image {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Default fallback background for assigned boxes (blue) */
.newsletter-card-bg-fallback {
  background-color: #8eb0d3;
}

/* Grey fallback background for user-chosen boxes */
[data-section-type="user_ticker"] .newsletter-card-bg-fallback {
  background-color: #9ca3af;
}

/* Different gradients for image vs fallback backgrounds */
.newsletter-card-bg-with-image + .newsletter-card-content {
  background: linear-gradient(to bottom, rgba(0,0,0,0.3), rgba(0,0,0,0.6));
}

.newsletter-card-bg-fallback + .newsletter-card-content {
  background: linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.3));
}

/* Lighter gradient overlay for user-selected tickers to make grey background more visible */
[data-section-type="user_ticker"] .newsletter-card-bg-fallback + .newsletter-card-content {
  background: linear-gradient(to bottom, rgba(0,0,0,0.05), rgba(0,0,0,0.2));
}

/* Utility class for text clamping in newsletter cards */
.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Newsletter card hover functionality to show description (only when description exists) */
.newsletter-card:hover .card-middle .title-content {
  display: none;
}

.newsletter-card:hover .card-middle .description-content {
  display: flex !important;
}

/* Ensure middle content area has proper sizing */
.card-middle {
  position: relative;
  min-height: 120px;
  flex: 1;
}

.card-middle .title-content {
  display: block;
}

.card-middle .description-content {
  display: none;
  height: 100%;
  align-items: center;
  justify-content: center;
}

/* Description text clamping to prevent box resizing */
.description-text {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-wrap: break-word;
}

/* Type indicator background colors */
.type-indicator-company {
  background-color: #000033;
  color: white;
}

.type-indicator-topic {
  background-color: #beb7ac;
  color: white;
}

.type-indicator-city {
  background-color: #94d2f9;
  color: white;
}

.type-indicator-region {
  background-color: #94d2f9;
  color: white;
}

.type-indicator-newsletter {
  background-color: #99b8b2;
  color: white;
}