/* Static IELTS writing report marketing snapshots — no JS */

.iwr-snapshot {
  --iwr-surface: rgb(15 23 42);
  --iwr-surface-muted: rgb(30 41 59);
  --iwr-border: rgb(51 65 85);
  --iwr-text: rgb(226 232 240);
  --iwr-muted: rgb(148 163 184);
  --iwr-accent: rgb(56 189 248);
  --iwr-accent-soft: rgb(14 116 144 / 0.25);
  --iwr-warn: rgb(251 191 36);
  --iwr-orange: rgb(251 146 60);
  --iwr-orange-soft: rgb(154 52 18 / 0.22);
  --iwr-orange-text: rgb(253 186 116);
  --iwr-amber: rgb(251 191 36);
  --iwr-amber-soft: rgb(120 53 15 / 0.28);
  --iwr-amber-text: rgb(253 224 71);
  --iwr-near: rgb(34 211 238);
  --iwr-near-soft: rgb(14 116 144 / 0.28);
  --iwr-near-text: rgb(103 232 249);
  --iwr-success: rgb(52 211 153);
  --iwr-success-soft: rgb(6 78 59 / 0.35);
  --iwr-success-text: rgb(167 243 208);
  --iwr-priority: rgb(251 113 133);
  --iwr-priority-soft: rgb(136 19 55 / 0.32);
  --iwr-priority-text: rgb(253 164 175);
}

@media (prefers-color-scheme: light) {
  .iwr-snapshot {
    --iwr-surface: rgb(248 250 252);
    --iwr-surface-muted: rgb(241 245 249);
    --iwr-border: rgb(203 213 225);
    --iwr-text: rgb(15 23 42);
    --iwr-muted: rgb(71 85 105);
    --iwr-accent: rgb(2 132 199);
    --iwr-accent-soft: rgb(224 242 254);
    --iwr-warn: rgb(180 83 9);
    --iwr-orange: rgb(234 88 12);
    --iwr-orange-soft: rgb(255 237 213);
    --iwr-orange-text: rgb(194 65 12);
    --iwr-amber: rgb(217 119 6);
    --iwr-amber-soft: rgb(254 243 199);
    --iwr-amber-text: rgb(146 64 14);
    --iwr-near: rgb(8 145 178);
    --iwr-near-soft: rgb(207 250 254);
    --iwr-near-text: rgb(14 116 144);
    --iwr-success: rgb(5 150 105);
    --iwr-success-soft: rgb(209 250 229);
    --iwr-success-text: rgb(6 95 70);
    --iwr-priority: rgb(225 29 72);
    --iwr-priority-soft: rgb(255 228 230);
    --iwr-priority-text: rgb(190 18 60);
  }
}

.iwr-snapshot {
  color: var(--iwr-text);
}

.iwr-banner {
  border: 1px solid var(--iwr-border);
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
  background: var(--iwr-accent-soft);
}

.iwr-panel {
  border: 1px solid var(--iwr-border);
  border-radius: 0.75rem;
  padding: 1.25rem 1.5rem;
  background: color-mix(in srgb, var(--iwr-surface-muted) 88%, transparent);
}

.iwr-score-grid {
  display: grid;
  gap: 1rem;
}

@media (min-width: 768px) {
  .iwr-score-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.iwr-score-card {
  border: 1px solid var(--iwr-border);
  border-radius: 0.75rem;
  padding: 1.25rem;
  background: var(--iwr-surface-muted);
}

.iwr-score-card--primary {
  border-color: color-mix(in srgb, var(--iwr-accent) 45%, var(--iwr-border));
  background: var(--iwr-accent-soft);
}

.iwr-score-value {
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1.1;
  color: var(--iwr-accent);
}

.iwr-criteria-grid {
  display: grid;
  gap: 1rem;
}

@media (min-width: 640px) {
  .iwr-criteria-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .iwr-criteria-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.iwr-criterion-card {
  display: block;
  border: 1px solid var(--iwr-border);
  border-left: 4px solid var(--iwr-accent);
  border-radius: 0.75rem;
  padding: 1rem;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s ease;
}

.iwr-criterion-card:hover,
.iwr-criterion-card:focus-visible {
  background: var(--iwr-surface-muted);
  outline: 2px solid var(--iwr-accent);
  outline-offset: 2px;
}

.iwr-band-pill {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 3.5rem;
  padding: 0.35rem 0.65rem;
  border-radius: 0.5rem;
  border: 1px solid color-mix(in srgb, var(--iwr-accent) 50%, var(--iwr-border));
  background: var(--iwr-accent-soft);
  font-weight: 700;
  font-size: 1.125rem;
}

.iwr-partner-logo {
  display: block;
  width: auto;
  max-width: 12rem;
  max-height: 4.5rem;
  height: auto;
  object-fit: contain;
  flex: 0 0 auto;
}

.bc-writeup-report .iwr-partner-logo {
  max-height: 3rem;
}

@media (min-width: 640px) {
  .bc-writeup-report .iwr-partner-logo {
    max-height: 4.5rem;
  }
}

.iwr-pathora-logo {
  display: block;
  width: auto;
  max-width: 10rem;
  max-height: 3.75rem;
  height: auto;
  object-fit: contain;
  flex: 0 0 auto;
}

.pathora-ai-report .iwr-pathora-logo {
  max-height: 2.75rem;
}

@media (min-width: 640px) {
  .pathora-ai-report .iwr-pathora-logo {
    max-height: 3.75rem;
  }
}

.iwr-logo-placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.5rem;
  min-height: 4.5rem;
  padding: 0.5rem 0.75rem;
  border: 1px dashed var(--iwr-border);
  border-radius: 0.5rem;
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--iwr-muted);
  text-align: center;
}

.iwr-snapshot details {
  border: 1px solid var(--iwr-border);
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
  background: color-mix(in srgb, var(--iwr-surface-muted) 70%, transparent);
}

.iwr-snapshot details > summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 600;
  color: var(--iwr-text);
}

.iwr-snapshot details > summary::-webkit-details-marker {
  display: none;
}

.iwr-snapshot details > summary::before {
  content: "";
  display: inline-block;
  width: 0.45rem;
  height: 0.45rem;
  border-right: 2px solid var(--iwr-muted);
  border-bottom: 2px solid var(--iwr-muted);
  transform: rotate(-45deg);
  transition: transform 0.2s ease;
  flex-shrink: 0;
}

.iwr-snapshot details[open] > summary::before {
  transform: rotate(45deg);
}

.iwr-snapshot .iwr-answer {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--iwr-border);
}

.iwr-snapshot .iwr-answer p {
  margin: 0 0 0.85rem;
  line-height: 1.65;
  white-space: pre-line;
}

.iwr-snapshot ul {
  margin: 0.5rem 0 0;
  padding-left: 1.25rem;
}

.iwr-snapshot li {
  margin: 0.35rem 0;
  line-height: 1.55;
}

.iwr-snapshot dl {
  display: grid;
  gap: 0.75rem;
}

@media (min-width: 640px) {
  .iwr-snapshot dl.iwr-dl-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.iwr-snapshot dt {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--iwr-muted);
}

.iwr-snapshot dd {
  margin: 0.25rem 0 0;
  font-size: 0.9rem;
  line-height: 1.55;
}

.iwr-disclaimer {
  font-size: 0.8rem;
  color: var(--iwr-muted);
  border-top: 1px solid var(--iwr-border);
  padding-top: 1.25rem;
}

.iwr-gap-warning {
  color: var(--iwr-warn);
  font-weight: 700;
}

.iwr-bc-feedback p {
  margin: 0.4rem 0;
  line-height: 1.55;
}

.iwr-bc-feedback strong {
  color: var(--iwr-text);
}

/* British Council WriteUp snapshot — tone mapping */

.iwr-bc-tone-success-soft {
  border: 1px solid color-mix(in srgb, var(--iwr-success) 45%, var(--iwr-border));
  background: var(--iwr-success-soft);
  color: var(--iwr-success-text);
}

.iwr-bc-tone-orange-panel {
  border-color: color-mix(in srgb, var(--iwr-orange) 55%, var(--iwr-border));
  background: var(--iwr-orange-soft);
}

.iwr-bc-tone-orange-text {
  color: var(--iwr-orange-text);
}

.iwr-bc-tone-orange {
  border: 1px solid color-mix(in srgb, var(--iwr-orange) 55%, var(--iwr-border));
  background: var(--iwr-orange-soft);
  color: var(--iwr-orange-text);
}

.iwr-bc-tone-warning {
  border-left-color: var(--iwr-amber);
}

.iwr-bc-tone-warning .iwr-bc-target-pill.iwr-bc-tone-warning,
.iwr-bc-target-pill.iwr-bc-tone-warning {
  border: 1px solid color-mix(in srgb, var(--iwr-amber) 55%, var(--iwr-border));
  background: var(--iwr-amber-soft);
  color: var(--iwr-amber-text);
}

.iwr-bc-tone-priority {
  border-left-color: var(--iwr-priority);
}

.iwr-bc-tone-priority .iwr-bc-target-pill.iwr-bc-tone-priority,
.iwr-bc-target-pill.iwr-bc-tone-priority {
  border: 1px solid color-mix(in srgb, var(--iwr-priority) 55%, var(--iwr-border));
  background: var(--iwr-priority-soft);
  color: var(--iwr-priority-text);
}

.iwr-bc-meta-pill {
  display: inline-flex;
  border-radius: 9999px;
  padding: 0.2rem 0.65rem;
  font-size: 0.75rem;
  font-weight: 600;
  border: 1px solid var(--iwr-border);
  background: var(--iwr-surface-muted);
  color: var(--iwr-text);
}

.iwr-bc-target-pill {
  display: inline-flex;
  border-radius: 9999px;
  padding: 0.25rem 0.65rem;
  font-size: 0.75rem;
  font-weight: 600;
}

.iwr-bc-criterion-card {
  display: block;
  border: 1px solid var(--iwr-border);
  border-left-width: 4px;
  border-radius: 0.75rem;
  padding: 1rem;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

.iwr-bc-criterion-card:hover,
.iwr-bc-criterion-card:focus-visible {
  background: color-mix(in srgb, var(--iwr-surface-muted) 90%, var(--iwr-text) 2%);
  outline: 2px solid var(--iwr-accent);
  outline-offset: 2px;
}

.iwr-bc-criterion-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.iwr-bc-score-box {
  flex-shrink: 0;
  min-width: 3.25rem;
  border-radius: 0.5rem;
  border: 1px solid color-mix(in srgb, var(--iwr-near) 45%, var(--iwr-border));
  background: var(--iwr-near-soft);
  padding: 0.35rem 0.55rem;
  text-align: center;
  color: var(--iwr-near-text);
}

/* Score boxes follow the same tone as target pills on the parent card/panel */
.bc-writeup-report .iwr-bc-tone-warning .iwr-bc-score-box,
.bc-writeup-report .iwr-bc-criterion-card.iwr-bc-tone-warning .iwr-bc-score-box {
  border-color: color-mix(in srgb, var(--iwr-amber) 55%, var(--iwr-border));
  background: var(--iwr-amber-soft);
  color: var(--iwr-amber-text);
}

.bc-writeup-report .iwr-bc-tone-priority .iwr-bc-score-box,
.bc-writeup-report .iwr-bc-criterion-card.iwr-bc-tone-priority .iwr-bc-score-box {
  border-color: color-mix(in srgb, var(--iwr-priority) 55%, var(--iwr-border));
  background: var(--iwr-priority-soft);
  color: var(--iwr-priority-text);
}

.bc-writeup-report .iwr-bc-tone-orange .iwr-bc-score-box,
.bc-writeup-report .iwr-bc-tone-orange-panel .iwr-bc-score-box {
  border-color: color-mix(in srgb, var(--iwr-orange) 55%, var(--iwr-border));
  background: var(--iwr-orange-soft);
  color: var(--iwr-orange-text);
}

.bc-writeup-report .iwr-bc-tone-success .iwr-bc-score-box,
.bc-writeup-report .iwr-bc-criterion-card.iwr-bc-tone-success .iwr-bc-score-box {
  border-color: color-mix(in srgb, var(--iwr-success) 45%, var(--iwr-border));
  background: var(--iwr-success-soft);
  color: var(--iwr-success-text);
}

.bc-writeup-report .iwr-bc-tone-near .iwr-bc-score-box,
.bc-writeup-report .iwr-bc-criterion-card.iwr-bc-tone-near .iwr-bc-score-box {
  border-color: color-mix(in srgb, var(--iwr-near) 45%, var(--iwr-border));
  background: var(--iwr-near-soft);
  color: var(--iwr-near-text);
}

.iwr-bc-score-box--large {
  min-width: 4.5rem;
  border-radius: 0.75rem;
  padding: 0.5rem 0.75rem;
}

.iwr-bc-score-box-label {
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  opacity: 0.85;
}

.iwr-bc-score-box-value {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
}

.iwr-bc-score-box--large .iwr-bc-score-box-value {
  font-size: 1.5rem;
}

.iwr-bc-view-details {
  display: block;
  margin-top: 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--iwr-muted);
}

.bc-writeup-report .bc-language-panel,
.bc-writeup-report .bc-criterion-panel,
.bc-writeup-report .bc-task-panel {
  padding: 0;
  overflow: hidden;
}

.bc-writeup-report .bc-language-panel > summary,
.bc-writeup-report .bc-criterion-panel > summary,
.bc-writeup-report .bc-task-panel > summary {
  padding: 1rem 1.25rem;
}

.bc-writeup-report .bc-language-panel > summary::before,
.bc-writeup-report .bc-criterion-panel > summary::before,
.bc-writeup-report .bc-task-panel > summary::before {
  display: none;
}

.bc-language-panel-summary,
.bc-criterion-panel-summary,
.bc-task-panel-summary {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  text-align: left;
}

.bc-criterion-panel-summary {
  align-items: flex-start;
}

@media (min-width: 640px) {
  .bc-criterion-panel-summary {
    align-items: center;
  }
}

.bc-language-panel-title,
.bc-criterion-panel-heading {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-width: 0;
}

.bc-criterion-panel-heading {
  flex: 1;
  align-items: flex-start;
}

.bc-criterion-title {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  color: var(--iwr-text);
}

.bc-criterion-meta {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.875rem;
  color: var(--iwr-muted);
}

.bc-details-hint {
  flex-shrink: 0;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--iwr-muted);
}

.bc-writeup-report details[open] > summary .bc-details-closed,
.bc-writeup-report details:not([open]) > summary .bc-details-open {
  display: none;
}

/* BC accordion chevrons — fixed inline size (overrides flex stretch / block svg defaults) */
.bc-writeup-report .bc-details-chevron,
.bc-writeup-report .bc-task-chevron {
  width: 0.875rem;
  height: 0.875rem;
  min-width: 0.875rem;
  min-height: 0.875rem;
  max-width: 0.875rem;
  max-height: 0.875rem;
  flex: 0 0 0.875rem;
  align-self: center;
  display: inline-block;
  vertical-align: middle;
  overflow: visible;
  opacity: 0.8;
  transition: transform 0.2s ease;
}

.bc-writeup-report .bc-task-chevron {
  color: var(--iwr-muted);
  opacity: 1;
}

.bc-writeup-report .bc-language-panel-title > .bc-details-chevron,
.bc-writeup-report .bc-criterion-panel-heading > .bc-details-chevron {
  margin-top: 0.125rem;
}

.bc-writeup-report details[open] > summary .bc-details-chevron {
  transform: rotate(180deg);
}

.bc-writeup-report .bc-task-panel[open] > summary .bc-task-chevron {
  transform: rotate(90deg);
}

.bc-language-panel-body {
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid var(--iwr-border);
}

.bc-criterion-panel {
  margin-top: 1rem;
  border-left-width: 4px;
}

.bc-criterion-panel-summary {
  border-bottom: 1px solid var(--iwr-border);
  background: color-mix(in srgb, var(--iwr-surface-muted) 85%, transparent);
}

.bc-criterion-panel-body {
  padding: 1.25rem;
  display: grid;
  gap: 1.25rem;
}

.bc-section-label {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--iwr-muted);
}

.bc-feedback-text {
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
  line-height: 1.65;
  max-width: 48rem;
}

.bc-feedback-text em {
  font-style: italic;
}

.iwr-bc-breakdown-grid {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

@media (min-width: 1024px) {
  .iwr-bc-breakdown-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.iwr-bc-breakdown-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  border: 1px solid var(--iwr-border);
  border-radius: 0.5rem;
  padding: 1rem;
  background: color-mix(in srgb, var(--iwr-surface-muted) 80%, transparent);
}

.iwr-bc-breakdown-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 4.5rem;
}

.iwr-bc-breakdown-card-head h6 {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.45;
  color: var(--iwr-text);
}

.iwr-bc-score-pill {
  flex-shrink: 0;
  display: inline-flex;
  border-radius: 9999px;
  border: 1px solid color-mix(in srgb, var(--iwr-near) 45%, var(--iwr-border));
  background: var(--iwr-near-soft);
  padding: 0.15rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--iwr-near-text);
}

.iwr-bc-breakdown-fields {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
  flex: 1;
}

.iwr-bc-breakdown-fields p {
  margin: 0.35rem 0 0;
  font-size: 0.875rem;
  line-height: 1.55;
}

.bc-task-panel-body {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--iwr-border);
  display: grid;
  gap: 1.25rem;
}

.iwr-bc-learner-response {
  border: 1px solid var(--iwr-border);
  border-radius: 0.5rem;
  padding: 1rem;
  background: var(--iwr-surface);
}

@media (max-width: 639px) {
  .bc-criterion-panel-summary {
    flex-direction: column;
    align-items: stretch;
  }

  .bc-criterion-panel-summary .iwr-bc-score-box--large {
    align-self: flex-start;
  }
}
