/* Gerador de Aulas — identidade e recibo do modo Plano
   Mockup aprovado: mockups/gerador-aulas-vinculado-plano-v1.html */

.ga-generator-shell.is-plan-mode {
  --ga-plan-mint: #63dfb5;
  --ga-plan-mint-soft: rgba(99, 223, 181, .1);
  --ga-plan-gold: #e6c14f;
  --ga-plan-line: rgba(99, 223, 181, .24);
  border-color: rgba(99, 223, 181, .3) !important;
  box-shadow: 0 22px 70px rgba(7, 4, 11, .28);
}

.ga-plan-mode-hero {
  position: relative;
  overflow: hidden;
  margin: 0 0 12px;
  border: 1px solid rgba(99, 223, 181, .38);
  border-radius: 17px;
  background: linear-gradient(112deg, rgba(42, 18, 56, .98), rgba(21, 51, 44, .94));
  box-shadow: 0 14px 42px rgba(0, 0, 0, .18);
}

.ga-plan-mode-hero::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(#63dfb5, #b9ffe7);
}

.ga-plan-mode-hero::after {
  content: "";
  position: absolute;
  width: 280px;
  height: 280px;
  top: -205px;
  right: -95px;
  border-radius: 50%;
  background: rgba(99, 223, 181, .12);
}

.ga-plan-mode-main {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 22px;
  padding: 20px 22px 16px 27px;
}

.ga-plan-mode-main small {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #9cf0d2;
  font: 800 10px/1.3 Poppins, Inter, sans-serif;
  letter-spacing: .075em;
}

.ga-plan-mode-main small i {
  font-size: 7px;
  filter: drop-shadow(0 0 5px #63dfb5);
}

.ga-plan-mode-main h2 {
  margin: 7px 0 0;
  color: #fff;
  font: 700 clamp(18px, 2vw, 23px)/1.2 Poppins, Inter, sans-serif;
}

.ga-plan-mode-main p {
  max-width: 850px;
  margin: 7px 0 0;
  color: #d2c4d8;
  font-size: 12px;
  line-height: 1.55;
}

.ga-plan-mode-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}

.ga-plan-mode-actions button,
.ga-plan-phase-identity button {
  min-height: 40px;
  border: 1px solid rgba(99, 223, 181, .34);
  border-radius: 10px;
  background: rgba(15, 42, 35, .72);
  color: #caffed;
  padding: 0 12px;
  font: 700 11px Poppins, Inter, sans-serif;
  cursor: pointer;
}

.ga-plan-mode-actions button + button {
  border-color: rgba(255, 255, 255, .18);
  background: rgba(16, 10, 22, .42);
  color: #eee5f1;
}

.ga-plan-mode-actions i,
.ga-plan-phase-identity button i {
  margin-right: 6px;
}

.ga-plan-mode-facts {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-left: 5px;
  border-top: 1px solid rgba(99, 223, 181, .13);
  background: rgba(7, 5, 10, .22);
}

.ga-plan-mode-facts > div {
  min-width: 0;
  padding: 12px 16px;
  border-right: 1px solid rgba(99, 223, 181, .11);
}

.ga-plan-mode-facts > div:last-child { border-right: 0; }
.ga-plan-mode-facts small,
.ga-plan-final-receipt small,
.ga-plan-dialog-stats small {
  display: block;
  color: #9b8aa5;
  font: 800 8.5px Poppins, Inter, sans-serif;
  letter-spacing: .07em;
}

.ga-plan-mode-facts b {
  display: block;
  margin-top: 4px;
  color: #fff;
  font-size: 11px;
}

.ga-plan-mode-facts .is-good b { color: #8fe6c8; }
.ga-plan-mode-facts .is-pending b { color: #ffd887; }

.ga-plan-context-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  margin: 12px 0 17px;
  border: 1px solid #3a2c43;
  border-radius: 13px;
  background: rgba(26, 18, 34, .82);
}

.ga-plan-context-flow > div {
  position: relative;
  min-height: 66px;
  padding: 12px 12px 11px 47px;
  border-right: 1px solid #382a41;
}

.ga-plan-context-flow > div:last-child { border-right: 0; }
.ga-plan-context-flow i {
  position: absolute;
  top: 15px;
  left: 14px;
  width: 25px;
  height: 25px;
  border-radius: 8px;
  background: rgba(99, 223, 181, .1);
  color: #63dfb5;
  display: grid;
  place-items: center;
  font-size: 11px;
}

.ga-plan-context-flow small {
  display: block;
  color: #63dfb5;
  font-size: 8px;
  font-weight: 800;
}

.ga-plan-context-flow b {
  display: block;
  margin: 3px 0 2px;
  color: #f5eef7;
  font-size: 10.5px;
}

.ga-plan-context-flow span {
  display: block;
  color: #94839f;
  font-size: 8.5px;
  line-height: 1.35;
}

.ga-plan-step-source {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: start;
  margin: 0 0 18px;
  padding: 13px 14px;
  border: 1px solid rgba(99, 223, 181, .27);
  border-radius: 12px;
  background: linear-gradient(100deg, rgba(22, 55, 47, .72), rgba(31, 23, 39, .68));
}

.ga-plan-step-source-icon {
  width: 31px;
  height: 31px;
  border-radius: 9px;
  background: #215045;
  color: #63dfb5;
  display: grid;
  place-items: center;
}

.ga-plan-step-source small {
  display: block;
  color: #63dfb5;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .06em;
}

.ga-plan-step-source b {
  display: block;
  margin-top: 3px;
  color: #fff;
  font: 600 11px Poppins, Inter, sans-serif;
}

.ga-plan-step-source p {
  margin: 3px 0 0;
  color: #b6a6bf;
  font-size: 9.5px;
  line-height: 1.45;
}

.ga-plan-step-source button,
.ga-plan-final-receipt header button,
.ga-plan-context-open,
.ga-memory-retry {
  min-height: 38px;
  border: 1px solid #594463;
  border-radius: 9px;
  background: #281b31;
  color: #e7dce9;
  padding: 0 11px;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.ga-plan-step-source button i,
.ga-plan-context-open i,
.ga-memory-retry i { margin-right: 6px; }

.ga-plan-side-stack {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.ga-plan-context-rail {
  overflow: hidden;
  border: 1px solid #3d2d46;
  border-radius: 13px;
  background: #17101f;
  padding: 14px;
}

.ga-plan-context-rail > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 11px;
}

.ga-plan-context-rail > header small {
  color: #63dfb5;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .07em;
}

.ga-plan-context-rail > header h3 {
  margin: 4px 0 0;
  color: #fff;
  font: 600 13px Poppins, Inter, sans-serif;
}

.ga-plan-context-rail > header button {
  width: 31px;
  height: 31px;
  flex: 0 0 auto;
  border: 1px solid #4a3654;
  border-radius: 9px;
  background: #24182d;
  color: #c7b2d0;
  cursor: pointer;
}

.ga-plan-context-proof {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 9px;
  padding: 10px;
  border: 1px solid #33715f;
  border-radius: 10px;
  background: #15332b;
}

.ga-plan-context-proof.is-blocked {
  border-color: #7c3948;
  background: #351d25;
}

.ga-plan-context-proof > div {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
  color: #caffed;
  font-size: 9px;
}

.ga-plan-context-proof.is-blocked > div { color: #ffc1c8; }
.ga-plan-context-proof span {
  flex: 0 0 auto;
  color: #63dfb5;
  font-size: 7px;
  font-weight: 800;
}
.ga-plan-context-proof.is-blocked span { color: #ffacb6; }

.ga-plan-context-card {
  overflow: hidden;
  margin-top: 7px;
  border: 1px solid #3e2d47;
  border-radius: 10px;
  background: #1e1426;
}

.ga-plan-context-card.is-current {
  border-color: #927430;
  background: #282018;
}

.ga-plan-context-card > button {
  width: 100%;
  min-height: 52px;
  border: 0;
  background: transparent;
  color: #eee5f1;
  display: grid;
  grid-template-columns: 27px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  padding: 9px;
  text-align: left;
  cursor: pointer;
}

.ga-plan-context-card > button > i {
  width: 27px;
  height: 27px;
  border-radius: 8px;
  background: #2d2035;
  color: #cfb9d8;
  display: grid;
  place-items: center;
  font-size: 10px;
}

.ga-plan-context-card.is-current > button > i {
  background: #493b18;
  color: #f2d958;
}

.ga-plan-context-card b { display: block; font-size: 9.5px; }
.ga-plan-context-card small { display: block; margin-top: 2px; color: #91809b; font-size: 7.5px; }
.ga-plan-context-card em {
  border: 1px solid #4f3b59;
  border-radius: 999px;
  color: #baabc1;
  padding: 3px 5px;
  font-size: 7px;
  font-style: normal;
  white-space: nowrap;
}

.ga-plan-context-card > div {
  display: none;
  border-top: 1px solid #3c2b44;
  padding: 9px 11px;
  color: #a895b1;
  font-size: 8px;
  line-height: 1.45;
}

.ga-plan-context-card.is-open > div { display: grid; gap: 4px; }
.ga-plan-context-open { width: 100%; margin-top: 10px; }

.ga-plan-memory.is-error {
  border-color: rgba(224, 90, 116, .6) !important;
  background: rgba(80, 27, 39, .45) !important;
}

.ga-plan-memory.is-error .ga-memory-proof { color: #ffacb6 !important; }
.ga-memory-retry { margin: 10px 14px 13px; border-color: rgba(255, 172, 182, .45); color: #ffc5cc; }

.ga-plan-final-receipt {
  margin-top: 17px;
  padding-top: 16px;
  border-top: 1px solid #3a2b43;
}

.ga-plan-final-receipt > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.ga-plan-final-receipt h3 {
  margin: 4px 0 0;
  color: #fff;
  font: 600 14px Poppins, Inter, sans-serif;
}

.ga-plan-receipt-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.ga-plan-receipt-grid article {
  min-width: 0;
  border: 1px solid #44314d;
  border-radius: 11px;
  background: #21162a;
  padding: 12px;
}

.ga-plan-receipt-grid article.is-good { border-color: #2f6c5b; background: #17332c; }
.ga-plan-receipt-grid article.is-blocked { border-color: #7c3948; background: #351d25; }
.ga-plan-receipt-grid b { display: block; margin: 5px 0; color: #fff; font-size: 10.5px; }
.ga-plan-receipt-grid .is-good b { color: #8fe6c8; }
.ga-plan-receipt-grid .is-blocked b { color: #ffacb6; }
.ga-plan-receipt-grid span { display: block; color: #a995b3; font-size: 8.5px; line-height: 1.4; }

.ga-plan-final-contract {
  margin-top: 10px;
  border: 1px solid rgba(99, 223, 181, .36);
  border-radius: 12px;
  background: linear-gradient(115deg, #17342d, #23182c);
  padding: 13px;
}

.ga-plan-final-contract > b { color: #fff; font: 600 11px Poppins, Inter, sans-serif; }
.ga-plan-final-contract ul { list-style: none; margin: 9px 0 0; padding: 0; display: grid; gap: 6px; }
.ga-plan-final-contract li { color: #cdbed4; font-size: 8.5px; }
.ga-plan-final-contract li::before { content: "✓"; margin-right: 7px; color: #63dfb5; font-weight: 800; }

.ga-plan-phase-identity {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: -18px -18px 18px;
  padding: 12px 15px;
  border-bottom: 1px solid rgba(99, 223, 181, .22);
  background: linear-gradient(100deg, rgba(38, 20, 50, .96), rgba(19, 48, 41, .92));
}

.ga-plan-phase-identity > div:first-child small { display: block; color: #63dfb5; font-size: 8px; font-weight: 800; }
.ga-plan-phase-identity > div:first-child b { display: block; margin-top: 3px; color: #fff; font-size: 11px; }
.ga-plan-phase-identity > div:first-child span { display: block; margin-top: 2px; color: #ab9bb4; font-size: 8.5px; }
.ga-plan-phase-identity > div:last-child { display: flex; align-items: center; gap: 8px; }
.ga-plan-phase-identity > div:last-child > span { border: 1px solid #347864; border-radius: 999px; padding: 6px 8px; color: #9cf0d2; font-size: 8px; font-weight: 800; }
.ga-plan-phase-identity > div:last-child > span.is-blocked { border-color: #7c3948; color: #ffacb6; }
.ga-plan-phase-identity > div:last-child > span i { margin-right: 5px; }

.ga-plan-context-dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10080;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(7, 4, 10, .8);
  backdrop-filter: blur(5px);
}

.ga-plan-context-dialog {
  width: min(920px, calc(100vw - 28px));
  max-height: min(800px, calc(100dvh - 30px));
  overflow: hidden;
  border: 1px solid #5d4568;
  border-radius: 18px;
  background: #17101f;
  color: #fff;
  box-shadow: 0 30px 100px rgba(0, 0, 0, .7);
}

.ga-plan-context-dialog > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 19px 21px;
  border-bottom: 1px solid #3d2c46;
}

.ga-plan-context-dialog > header small { color: #63dfb5; font-size: 8.5px; font-weight: 800; }
.ga-plan-context-dialog > header h2 { margin: 4px 0 0; font: 600 19px Poppins, Inter, sans-serif; }
.ga-plan-context-dialog > header p { margin: 4px 0 0; color: #9e8ba8; font-size: 10px; }
.ga-plan-context-dialog > header button { width: 42px; height: 42px; flex: 0 0 auto; border: 1px solid #4e3a58; border-radius: 11px; background: #24182d; color: #eee5f1; cursor: pointer; }
.ga-plan-context-dialog-body { max-height: calc(100dvh - 145px); overflow: auto; padding: 17px 21px 21px; }
.ga-plan-dialog-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ga-plan-dialog-stats article { min-width: 0; border: 1px solid #43314c; border-radius: 10px; background: #201629; padding: 11px; }
.ga-plan-dialog-stats b { display: block; margin-top: 5px; overflow: hidden; color: #fff; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.ga-plan-dialog-stats .is-good b { color: #63dfb5; }
.ga-plan-payload { overflow: hidden; margin-top: 11px; border: 1px solid #3f2e48; border-radius: 11px; }
.ga-plan-payload article { display: grid; grid-template-columns: 135px 120px minmax(0, 1fr); gap: 11px; align-items: start; padding: 10px 12px; border-bottom: 1px solid #35263d; }
.ga-plan-payload article:last-child { border-bottom: 0; }
.ga-plan-payload b { font-size: 9px; }
.ga-plan-payload span { color: #63dfb5; font-size: 8px; font-weight: 800; }
.ga-plan-payload p { margin: 0; color: #b5a4be; font-size: 8.5px; line-height: 1.45; }
.ga-plan-dialog-note { display: flex; gap: 8px; margin: 12px 0 0; color: #8f7e99; font-size: 8.5px; line-height: 1.45; }
.ga-plan-dialog-note i { margin-top: 2px; color: #63dfb5; }

body.theme-light .ga-generator-shell.is-plan-mode { background: linear-gradient(180deg, #fff, #faf7fc) !important; border-color: #c9dfd6 !important; }
body.theme-light .ga-plan-mode-hero { background: linear-gradient(112deg, #3c1655, #245e51); }
body.theme-light .ga-plan-context-flow,
body.theme-light .ga-plan-context-rail,
body.theme-light .ga-plan-context-card,
body.theme-light .ga-plan-receipt-grid article,
body.theme-light .ga-plan-dialog-stats article,
body.theme-light .ga-plan-context-dialog { background: #fff; }
body.theme-light .ga-plan-context-flow { border-color: #ded3e2; }
body.theme-light .ga-plan-context-flow > div { border-color: #e4dbe7; }
body.theme-light .ga-plan-context-flow b,
body.theme-light .ga-plan-context-rail h3,
body.theme-light .ga-plan-context-card > button,
body.theme-light .ga-plan-final-receipt h3,
body.theme-light .ga-plan-receipt-grid b,
body.theme-light .ga-plan-context-dialog,
body.theme-light .ga-plan-dialog-stats b,
body.theme-light .ga-plan-payload b { color: #2b1e31; }
body.theme-light .ga-plan-step-source { background: linear-gradient(100deg, #edf9f4, #faf7fc); }
body.theme-light .ga-plan-step-source b { color: #2b1e31; }
body.theme-light .ga-plan-step-source p,
body.theme-light .ga-plan-context-flow span,
body.theme-light .ga-plan-context-card small,
body.theme-light .ga-plan-receipt-grid span,
body.theme-light .ga-plan-payload p { color: #6f5e78; }
body.theme-light .ga-plan-context-card.is-current { background: #fffaf0; }
body.theme-light .ga-plan-receipt-grid article.is-good { background: #edf9f4; }
body.theme-light .ga-plan-receipt-grid article.is-blocked { background: #fff1f3; }
body.theme-light .ga-plan-final-contract { color: #fff; }
body.theme-light .ga-plan-context-dialog > header { border-color: #e2d7e6; }
body.theme-light .ga-plan-context-dialog > header button,
body.theme-light .ga-plan-step-source button,
body.theme-light .ga-plan-final-receipt header button,
body.theme-light .ga-plan-context-open { background: #fff; color: #3e2d46; }

@media (max-width: 1160px) {
  .ga-plan-mode-main { flex-direction: column; }
  .ga-plan-mode-actions { width: 100%; }
  .ga-plan-mode-actions button { flex: 1; }
  .ga-plan-mode-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ga-plan-mode-facts > div:nth-child(2) { border-right: 0; }
  .ga-plan-mode-facts > div:nth-child(-n + 2) { border-bottom: 1px solid rgba(99, 223, 181, .11); }
}

@media (max-width: 900px) {
  .ga-plan-context-flow { display: flex; overflow-x: auto; scroll-snap-type: x proximity; }
  .ga-plan-context-flow > div { flex: 0 0 220px; scroll-snap-align: start; }
  .ga-plan-side-stack { width: 100%; }
  .ga-plan-context-rail { order: -1; }
  .ga-plan-context-card > div { font-size: 9px; }
}

@media (max-width: 640px) {
  .ga-generator-shell.is-plan-mode { padding: 12px !important; border-radius: 14px !important; }
  .ga-plan-mode-main { padding: 18px 15px 14px 20px; }
  .ga-plan-mode-main h2 { font-size: 18px; }
  .ga-plan-mode-main p { font-size: 10.5px; }
  .ga-plan-mode-actions { flex-direction: column; }
  .ga-plan-mode-actions button { width: 100%; min-height: 44px; }
  .ga-plan-mode-facts { grid-template-columns: 1fr 1fr; }
  .ga-plan-mode-facts > div { padding: 10px; }
  .ga-plan-mode-facts b { font-size: 9.5px; }
  .ga-plan-step-source { grid-template-columns: 31px minmax(0, 1fr); padding: 11px; }
  .ga-plan-step-source button { grid-column: 1 / -1; width: 100%; min-height: 44px; }
  .ga-plan-receipt-grid,
  .ga-plan-dialog-stats { grid-template-columns: 1fr; }
  .ga-plan-final-receipt > header { display: block; }
  .ga-plan-final-receipt > header button { width: 100%; margin-top: 10px; min-height: 44px; }
  .ga-plan-phase-identity { margin: -28px -8px 16px; align-items: flex-start; flex-direction: column; }
  .ga-plan-phase-identity > div:last-child { width: 100%; }
  .ga-plan-phase-identity > div:last-child > span { flex: 1; }
  .ga-plan-phase-identity button { min-height: 44px; }
  .ga-plan-context-dialog-backdrop { padding: 7px; }
  .ga-plan-context-dialog { width: calc(100vw - 14px); max-height: calc(100dvh - 14px); border-radius: 14px; }
  .ga-plan-context-dialog > header { padding: 15px; }
  .ga-plan-context-dialog > header h2 { font-size: 16px; }
  .ga-plan-context-dialog-body { padding: 13px 15px 18px; max-height: calc(100dvh - 120px); }
  .ga-plan-payload article { grid-template-columns: 1fr; gap: 4px; }
  .ga-plan-context-rail > header button,
  .ga-plan-context-card > button { min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .ga-plan-mode-hero::after { display: none; }
}
