@charset "UTF-8";
/* BasinLens Open Reports Details Override Styles */

/* 1. Global Overrides */
/* body 背景变成白色 */
body {
  background-color: #ffffff !important;
}

main {
  margin-bottom: 0 !important;
}

/* 2. Header Overrides */
/* header 里面的子元素统一左对齐 */
#report-header h1 {
  text-align: left !important;
  margin-top: 0 !important;
  margin-bottom: 0.5rem !important; /* mb-2 */
}

/* Report Toolbar 响应式布局 Override */
.report-toolbar {
  justify-content: space-between; /* Override center */
}

.report-toolbar-left {
  display: flex;
  align-items: center;
}

.report-toolbar-right,
.ai-toolbar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* 在小屏幕上让工具栏换行 */
@media (max-width: 640px) {
  .report-toolbar {
    align-items: flex-start; /* Override center align for mobile */
  }

  .report-toolbar-right,
  .ai-toolbar {
    width: 100%;
  }
}

/* 3. Container & Layout */
/* article 的父级 div 容器变成 max-w-screen-xl mx-auto */
#report-container {
  max-width: 768px !important; /* max-w-screen-xl */
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 移除 lg:max-w-screen-lg 的响应式覆盖 */
@media (min-width: 1024px) {
  #report-container {
    max-width: 768px !important; /* 保持 max-w-screen-md */
  }
}

/* article 取消 padding rounded shadow */
#report-article {
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* 4. Sidebar */
/* Open Report Sidebar Styles */
#openReportSidebar {
  width: 256px;
}

#openReportSidebar .open-report-sidebar-container {
  width: 256px;
  overflow: hidden;
}

#openReportSidebar .open-report-sidebar-content {
  padding: 4px;
}

#openReportSidebar .open-report-sidebar-content.with-shadow {
    background: white;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

#openReportSidebar .open-report-sidebar-content img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 4px;
}

/* 在移动端和平板上隐藏侧边栏 */
@media (max-width: 1249px) {
  #openReportSidebar {
    display: none !important;
  }
}

/* 确保有足够的空间时才显示 */
@media (min-width: 1250px) {
  #openReportSidebar.has-space {
    display: block !important;
  }
}

/* 5. AI Tools */
/* AI 工具链接渐变边框 */
.ai-tool-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  position: relative;
  background: white;
  border-radius: 0.375rem;
  transition: all 0.3s ease;
}

.ai-tool-link img {
  width: 1.25rem;
  height: 1.25rem;
}

.ai-tool-link::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: 0.375rem;
  padding: 1px;
  background: linear-gradient(135deg, #e5e7eb 0%, #e5e7eb 50%, #e5e7eb 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  transition: all 0.3s ease;
  pointer-events: none;
}

.ai-tool-link:hover::before {
  background: linear-gradient(135deg, #f97316 0%, #d946ef 50%, #9333ea 100%);
}

.ai-tool-link:hover {
  box-shadow: 0 4px 12px rgba(249, 115, 22, 0.15);
}

/* 6. Footer */
footer {
    padding-bottom:0 !important;
    z-index: 50;
}

/* 7. Paywall (Moved from category-insight-details-2.11.0.css) */
.report-content.login-required-content section {
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none;    /* Firefox */
  -ms-user-select: none;     /* IE 10+ */
  user-select: none;         /* Standard */
  cursor: default;
}
.paywall-area {
  position: relative;
}
#paywall-wrapper {
  max-height: 400px;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, black 50%, transparent 100%);
  mask-image: linear-gradient(to bottom, black 50%, transparent 100%);
}
#paywall-container {
  position: relative;
  text-align: center;
  margin-top: -120px; /* 将按钮和文字上移到渐变区域 */
  padding-top: 6rem;
  padding-bottom: 6rem;
  background: linear-gradient(to top, white 30%, rgba(255, 255, 255, 0.9) 60%, transparent 100%);
  pointer-events: none; /* 允许点击穿透背景 */
}
#paywall-container > div {
    pointer-events: auto; /* 确保内部的 div 和按钮可以点击 */
}
#paywall-container h3 {
  font-size: 1.875rem !important; /* !text-3xl */
  line-height: 2.25rem !important;
  font-weight: 400 !important; /* !font-normal */
  letter-spacing: 0.1em; /* tracking-widest */
  color: #f97316; /* text-orange-500 */
  margin-bottom: 0.5rem; /* mb-2 */
}
#paywall-container p {
  color: #4b5563; /* text-gray-600 */
  margin-bottom: 1.5rem; /* mb-6 */
}
#paywall-login-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem; /* gap-2 */
  margin: 0 auto;
  background-color: #f97316; /* bg-orange-500 */
  color: #ffffff; /* text-white */
  font-weight: 500; /* font-medium */
  padding: 0.75rem 1.5rem; /* px-6 py-3 */
  border-radius: 0.375rem; /* rounded-md */
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); /* shadow-md */
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
#paywall-login-btn::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  transition: left 0.5s ease-in-out;
  pointer-events: none;
  z-index: 1;
}
#paywall-login-btn:hover::after {
  left: 100%;
}
#paywall-login-btn:hover {
  background-color: #ea580c; /* hover:bg-orange-600 */
  box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); /* shadow-xl */
  transform: translateY(-0.125rem);
}
#paywall-login-btn svg {
  width: 1.25rem; /* size-5 */
  height: 1.25rem; /* size-5 */
}
