/* ESAT Specific Styles */

/* Premium Badge */
.esat-premium-badge {
  display: inline-block;
  background: var(--color-primary);
  color: white;
  font-weight: 600;
  padding: 0.5rem 1.5rem;
  border-radius: 20px;
  font-size: 0.9rem;
}

/* Custom Papers Header */
.esat-custom-papers-header {
  text-align: center;
  margin-bottom: 3rem;
  color: var(--color-text-medium);
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

html[data-theme='dark'] .esat-custom-papers-header {
  color: var(--color-text-medium);
}

/* Category Grid */
.esat-category-grid {
  max-width: 1200px;
  margin: 0 auto 3rem auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: calc(var(--spacing-unit) * 2);
}

.esat-category-card {
  border: 2px solid var(--color-border); /* Default border */
  border-radius: var(--border-radius);
  padding: calc(var(--spacing-unit) * 2);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  text-align: center;
  transition: transform var(--transition-speed) ease, border-color var(--transition-speed) ease;
}

html[data-theme='dark'] .esat-category-card {
  background-color: var(--color-card-background);
  border-color: var(--color-border);
}

.esat-category-card:hover {
  transform: translateY(-5px);
}

.esat-category-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}

.esat-category-card-badge {
  display: inline-block;
  background: var(--color-primary); /* Default badge color */
  color: white;
  padding: 0.25rem 0.75rem;
  border-radius: 12px;
  font-size: 0.85rem;
  font-weight: 600;
}

html[data-theme='dark'] .esat-category-card-badge {
  background: var(--color-primary);
  color: var(--color-text-dark);
}

.esat-category-card h3 {
  margin-bottom: 0.5rem;
  color: var(--color-text-dark);
}

html[data-theme='dark'] .esat-category-card h3 {
  color: var(--color-text-dark);
}

.esat-category-card p {
  color: var(--color-text-medium);
  margin-bottom: 1rem;
  font-size: 0.95rem;
}

html[data-theme='dark'] .esat-category-card p {
  color: var(--color-text-medium);
}

.esat-category-card ul {
  list-style: none;
  padding: 0;
  margin-bottom: 1.5rem;
  color: var(--color-text-medium);
  font-size: 0.9rem;
  line-height: 1.8;
}

html[data-theme='dark'] .esat-category-card ul {
  color: var(--color-text-medium);
}

.esat-category-card .board-link {
  text-align: center;
  display: block;
  width: 100%;
  padding: calc(var(--spacing-unit) * 0.8) calc(var(--spacing-unit) * 1.5);
  border-radius: var(--border-radius);
  text-decoration: none;
  font-weight: 600;
  cursor: pointer;
  transition: background-color var(--transition-speed) ease, color var(--transition-speed) ease;
  background-color: var(--color-primary); /* Default button color */
  color: var(--color-card-background);
}

html[data-theme='dark'] .esat-category-card .board-link {
  background-color: var(--color-primary);
  color: var(--color-text-dark);
}

.esat-category-card .board-link:hover {
  background-color: var(--color-primary-hover); /* Slightly darker primary */
}

/* Specific Paper Styles */
.esat-paper-1 {
  border-color: var(--color-primary);
}
.esat-paper-1 .esat-category-card-badge {
  background: var(--color-primary);
}
.esat-paper-1 .board-link {
  background: var(--color-primary);
}

.esat-paper-2 {
  border-color: var(--color-success);
}
.esat-paper-2 .esat-category-card-badge {
  background: var(--color-success);
}
.esat-paper-2 .board-link {
  background: var(--color-success);
}

.esat-paper-3 {
  border-color: var(--color-gradient-primary-end); /* Using a primary gradient end color */
}
.esat-paper-3 .esat-category-card-badge {
  background: var(--color-gradient-primary-end);
}
.esat-paper-3 .board-link {
  background: var(--color-gradient-primary-end);
}

.esat-paper-4 {
  border-color: var(--color-gradient-gold-end); /* Using a gold gradient end color */
}
.esat-paper-4 .esat-category-card-badge {
  background: var(--color-gradient-gold-end);
}
.esat-paper-4 .board-link {
  background: var(--color-gradient-gold-end);
}

.esat-paper-5 {
  border-color: var(--color-error);
}
.esat-paper-5 .esat-category-card-badge {
  background: var(--color-error);
}
.esat-paper-5 .board-link {
  background: var(--color-error);
}

/* Coming Soon Card */
.esat-coming-soon-card {
  opacity: 0.6;
}

.esat-coming-soon-card .esat-category-card-badge {
  background: var(--color-border);
  color: var(--color-text-medium);
}

.esat-coming-soon-card .board-link {
  opacity: 0.5;
  cursor: not-allowed;
  background: var(--color-border);
  color: var(--color-text-medium);
}

/* Performance Dashboard */
.esat-performance-dashboard {
  padding: 2rem;
  background: var(--color-background);
  border-radius: var(--border-radius);
  border: 1px solid var(--color-border);
  max-width: 900px;
  margin: 0 auto 3rem auto;
}

.esat-performance-dashboard h2 {
  text-align: center;
  margin-bottom: 2rem;
}

.esat-performance-dashboard p {
  text-align: center;
  color: var(--color-text-medium);
}

/* Info Box */
.esat-info-box {
  padding: 2rem;
  background: var(--color-background);
  border-radius: var(--border-radius);
  border: 1px solid var(--color-border);
  max-width: 900px;
  margin: 0 auto 3rem auto;
}

.esat-info-box h3 {
  margin-bottom: 1rem;
}

.esat-info-box ul {
  list-style: none;
  padding: 0;
  color: var(--color-text-medium);
  line-height: 2;
}

.esat-info-box ul li strong {
  color: var(--color-text-dark);
}

/* Back Link */
.esat-back-link {
  text-align: center;
  margin-top: 30px;
}

/* ESAT Papers Page Styles */
.esat-papers-description {
  text-align: center;
  margin-bottom: 2rem;
  color: var(--color-text-medium);
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

.esat-papers-section {
  max-width: 600px;
  margin: 0 auto 3rem auto;
}

.esat-papers-card {
  padding: 2rem;
  background: var(--color-background);
  border-radius: var(--border-radius);
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-gradient-gold-end); /* Specific border color for this card */
}

.esat-papers-card h2 {
  margin-bottom: 1.5rem;
  color: var(--color-text-dark);
}

.esat-papers-link-container {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.esat-papers-link {
  display: block;
  padding: calc(var(--spacing-unit) * 0.8) calc(var(--spacing-unit) * 1.5);
  border-radius: var(--border-radius);
  text-decoration: none;
  font-weight: 600;
  cursor: pointer;
  transition: background-color var(--transition-speed) ease, color var(--transition-speed) ease, border-color var(--transition-speed) ease;
  background-color: var(--color-secondary); /* Assuming a secondary button style */
  color: var(--color-primary);
  border: 1px solid var(--color-primary);
}

.esat-papers-link:hover {
  background-color: var(--color-primary);
  color: var(--color-card-background);
}

.esat-papers-about-box {
  padding: 2rem;
  background: var(--color-background);
  border-radius: var(--border-radius);
  border: 1px solid var(--color-border);
  max-width: 800px;
  margin: 0 auto 3rem auto;
}

.esat-papers-about-box h3 {
  margin-bottom: 1rem;
  color: var(--color-text-dark);
}

.esat-papers-about-box p {
  color: var(--color-text-medium);
  line-height: 1.8;
}

/* ENGAA Specific Styles */
.esat-papers-engaa-card {
  border-left: 4px solid var(--color-gradient-primary-start); /* Specific border color for ENGAA card */
}

/* NSAA Specific Styles */
.esat-papers-nsaa-card {
  border-left: 4px solid var(--color-success); /* Specific border color for NSAA card */
}

/* TMUA Specific Styles */
.esat-papers-tmua-card {
  border-left: 4px solid var(--color-gradient-primary-end); /* Specific border color for TMUA card */
}

/* Loading Spinner */
.loading-spinner {
  border: 4px solid rgba(var(--color-primary-rgb), 0.2);
  border-top: 4px solid var(--color-primary);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  animation: spin 1s linear infinite;
  margin: 2rem auto;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Utility Classes */
.text-center {
  text-align: center;
}

.mt-30 {
  margin-top: 30px;
}

/* ESAT Resources Page Styles */
.esat-resources-header-section {
  padding: 1.6rem 1.4rem;
  background: var(--color-background);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius); /* Using generic border-radius */
  margin-bottom: 1.25rem;
  box-shadow: 0 10px 30px rgba(0,0,0,0.05); /* Consider using a variable for shadow color if needed */
}

.esat-resources-header-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  align-items: center;
}

.esat-resources-header-text p {
  color: var(--color-text-medium);
  margin: 0 0 0.25rem 0;
  font-size: 0.95rem;
}

.esat-resources-header-text h1 {
  margin: 0 0 0.35rem 0;
  font-size: 2.2rem; /* Adjust as needed */
  font-weight: 700;
  color: var(--color-text-dark);
}

.esat-resources-header-text .support-text {
  margin: 0;
  max-width: 720px;
  line-height: 1.7;
  text-align: left; /* Override default center alignment */
}

.esat-resources-header-actions {
  justify-self: end;
  display: flex;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.esat-resources-info-section {
  padding: 1.25rem;
  background: var(--color-background);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  margin-bottom: 1.25rem;
  max-width: 1100px; /* Added max-width */
  margin-left: auto; /* Center the section */
  margin-right: auto; /* Center the section */
}

.esat-resources-tags {
  display: flex;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

.esat-resources-tag {
  padding: 0.45rem 0.75rem;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  background: var(--color-background); /* Use a subtle background */
  color: var(--color-text-medium);
}

.esat-resources-formula-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 1rem;
}

.esat-resources-formula-card {
  padding: 0.8rem; /* Slightly reduced padding */
  background: var(--color-background); /* Use a slightly different background for cards */
  border-radius: 10px;
  border: 1px solid var(--color-border);
}

.esat-resources-formula-card summary {
  font-weight: 700;
  cursor: pointer;
  margin-bottom: 0.6rem;
  color: var(--color-text-dark);
}

.esat-resources-formula-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
  color: var(--color-text-medium);
  line-height: 1.7;
  font-size: 0.95rem;
  text-align: left; /* Align text left within the card */
}

.esat-resources-formula-card ul li {
  margin-bottom: 0.5rem; /* Add some space between list items */
  overflow-x: auto; /* Allow horizontal scrolling if content overflows */
  padding: 0.2rem 0; /* Add padding for better spacing */
}

.esat-resources-formula-card .katex-display {
  margin: 0.5em 0; /* Adjust margin for block math */
}

.esat-resources-prep-section {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); /* Adjusted minmax */
  gap: 1.25rem;
  max-width: 1000px; /* Reduced max-width */
  margin: 0 auto 1.5rem auto;
}

.esat-resources-prep-card {
  padding: 1.4rem;
  background: var(--color-background);
  border-radius: var(--border-radius);
  border: 1px solid var(--color-border);
}

.esat-resources-prep-card h3 {
  margin-bottom: 0.6rem;
  color: var(--color-text-dark);
}

.esat-resources-prep-card ul {
  list-style: disc;
  margin-left: 1.15rem;
  color: var(--color-text-medium);
  line-height: 1.75;
}

.esat-resources-runway-section {
  padding: 1.6rem;
  background: var(--color-background);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  max-width: 1000px;
  margin: 0 auto 1.8rem auto;
}

.esat-resources-runway-section h3 {
  text-align: center;
  margin-bottom: 1rem;
  color: var(--color-text-dark);
}

.esat-resources-runway-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.1rem;
}

.esat-resources-runway-card h4 {
  color: var(--color-primary);
  margin-bottom: 0.4rem;
}

.esat-resources-runway-card ul {
  list-style: none;
  padding: 0;
  color: var(--color-text-medium);
  line-height: 1.6;
  font-size: 0.95rem;
}

/* Responsive image styles for content within esat-resources */
.esat-resources-info-section img,
.esat-resources-prep-section img,
.esat-resources-runway-section img {
  max-width: 100%;
  height: auto;
  display: block; /* Prevents extra space below images */
  margin-bottom: 1rem; /* Add some spacing below images */
}

.esat-resources-bottom-nav {
  text-align: center;
  margin-bottom: 1.5rem;
  display: flex;
  justify-content: center;
  gap: 1rem;
}

/* ESAT Select Paper Page Styles */
.esat-select-paper-header {
  text-align: center;
  margin-bottom: 4rem; /* mb-16 */
}

.esat-select-paper-header h1 {
  font-size: 3rem; /* text-5xl */
  font-weight: 800; /* font-extrabold */
  color: var(--color-text-dark); /* text-gray-900 */
  margin-bottom: 1rem; /* mb-4 */
}

.esat-select-paper-header p {
  color: var(--color-text-medium); /* text-gray-600 */
  font-size: 1.125rem; /* text-lg */
  max-width: 50rem; /* max-w-2xl */
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 768px) { /* md:text-xl */
  .esat-select-paper-header p {
    font-size: 1.25rem;
  }
}

.esat-select-paper-grid {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 3rem; /* gap-12 */
}

.esat-select-paper-btn {
  background-color: var(--color-primary); /* bg-blue-600 (default) */
  color: white;
  border-radius: 1.5rem; /* rounded-3xl */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); /* shadow-xl */
  font-weight: 700; /* font-bold */
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16rem; /* w-64 */
  height: 16rem; /* h-64 */
  font-size: 1.875rem; /* text-3xl */
  text-align: center;
  transition: all var(--transition-speed) ease;
  border: none;
  cursor: pointer;
}

.esat-select-paper-btn:hover {
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); /* Consider using a variable for shadow color if needed */
  transform: translateY(-0.5rem); /* hover:-translate-y-2 */
}

@media (min-width: 768px) { /* md:text-4xl */
  .esat-select-paper-btn {
    font-size: 2.25rem;
  }
}

.esat-select-paper-btn.engaa {
  background-color: var(--color-gradient-primary-start); /* Using a primary gradient start color */
}

.esat-select-paper-btn.nsaa {
  background-color: var(--color-success); /* Using a success color */
}

.esat-select-paper-back-link {
  margin-top: 3rem; /* mt-30 */
  text-align: center;
}

/* ESAT Select Sections Page Styles */
.esat-select-sections-header {
  text-align: center;
  margin-bottom: 3rem; /* mb-12 */
}

.esat-select-sections-header h1 {
  font-size: 3rem; /* text-5xl */
  font-weight: 700; /* font-bold */
  color: var(--color-text-dark); /* text-gray-800 */
  margin-bottom: 1rem; /* mb-4 */
}

.esat-select-sections-header p {
  color: var(--color-text-medium); /* text-gray-600 */
  text-align: center;
  max-width: 28rem; /* max-w-xl */
  margin-left: auto;
  margin-right: auto;
}

.esat-sections-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* Adjusted minmax for better responsiveness */
  gap: 2.5rem; /* gap-10 */
  width: 100%;
  max-width: 72rem; /* max-w-6xl */
  margin-left: auto;
  margin-right: auto;
}

.esat-section-card {
  background-color: var(--color-card-background); /* bg-white */
  padding: 5rem 1.25rem; /* p-20, adjusted for better visual */
  border-radius: var(--border-radius); /* Using generic border-radius */
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); /* Consider using a variable for shadow color if needed */
  font-size: 1.875rem; /* text-3xl */
  font-weight: 700; /* font-bold */
  transition: all var(--transition-speed) ease;
  text-align: center;
  cursor: pointer;
  border: 1px solid var(--color-border);
  color: var(--color-text-dark);
}

.esat-section-card:hover {
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); /* Consider using a variable for shadow color if needed */
  transform: translateY(-0.5rem); /* hover:-translate-y-2 */
}

.esat-section-card.coming-soon {
  background-color: var(--color-background); /* bg-gray-300 */
  color: var(--color-text-medium); /* text-gray-600 */
  cursor: not-allowed;
  opacity: 0.7;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); /* Consider using a variable for shadow color if needed */
  transform: none; /* Reset transform for disabled */
}

.esat-select-sections-back-btn {
  margin-top: 3rem; /* mt-12 */
  padding: 1.5rem 3rem; /* px-12 py-6 */
  border-radius: 1rem; /* rounded-2xl */
  background-color: var(--color-background); /* bg-gray-300 */
  color: var(--color-text-dark); /* text-gray-800 */
  font-size: 1.25rem; /* text-xl */
  font-weight: 600; /* font-semibold */
  transition: background-color var(--transition-speed) ease;
  border: none;
  cursor: pointer;
}

.esat-select-sections-back-btn:hover {
  background-color: var(--color-border); /* hover:bg-gray-400 */
}
