:root {
  --lglg-color-primary: #5e2ee6;
  --lglg-color-primary-soft: #f1ecfd;
  --lglg-color-secondary: #14b8b8;
  --lglg-color-secondary-text: #ffffff;
  --lglg-text: #1a1a2e;
  --lglg-muted: #6b6b80;
  --lglg-border: #e6e3f0;
  --lglg-bg-card: #ffffff;
}

.lglg-desc,
.lglg-desc * {
  box-sizing: border-box;
}

.lglg-desc {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  color: var(--lglg-text);
  background: transparent;
  font-family: Poppins, Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 1.6;
}

.lglg-desc a {
  color: inherit;
  text-decoration: none;
}

.lglg-desc-quick-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
  width: 100%;
  margin: 0 0 24px;
}

.lglg-desc-quick-card {
  min-width: 0;
  min-height: 112px;
  display: grid;
  align-content: space-between;
  gap: 14px;
  padding: 16px;
  color: var(--lglg-text);
  background: var(--lglg-bg-card);
  border: 1px solid var(--lglg-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  text-decoration: none;
}

.lglg-desc-quick-card:hover,
.lglg-desc-quick-card:focus {
  color: var(--lglg-text);
  text-decoration: none;
}

.lglg-desc-quick-card:focus-visible,
.lglg-desc-button:focus-visible,
.lglg-desc-links a:focus-visible,
.lglg-desc-faq summary:focus-visible {
  outline: 3px solid rgba(94, 46, 230, 0.25);
  outline-offset: 2px;
}

.lglg-desc-quick-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  color: var(--lglg-color-primary);
  background: var(--lglg-color-primary-soft);
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
}

.lglg-desc-quick-card strong {
  display: block;
  color: var(--lglg-text);
  font-size: 13px;
  line-height: 1.35;
}

.lglg-desc-quick-card small {
  display: block;
  margin-top: 3px;
  color: var(--lglg-muted);
  font-size: 10px;
  line-height: 1.45;
}

.lglg-desc-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.45fr);
  gap: 24px;
  align-items: start;
  width: 100%;
}

.lglg-desc-rail,
.lglg-desc-main {
  display: grid;
  gap: 24px;
  align-content: start;
  min-width: 0;
}

.lglg-desc-panel,
.lglg-desc-section {
  padding: 24px;
  color: var(--lglg-text);
  background: var(--lglg-bg-card);
  border: 1px solid var(--lglg-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.lglg-desc-kicker {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--lglg-color-primary);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.lglg-desc-panel h2,
.lglg-desc-section h2 {
  margin: 0;
  color: var(--lglg-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
}

.lglg-desc-check-list {
  display: grid;
  margin-top: 16px;
}

.lglg-desc-check-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  padding: 15px 0;
  border-top: 1px solid var(--lglg-border);
}

.lglg-desc-check-item:first-child {
  border-top: 0;
}

.lglg-desc-number {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  color: var(--lglg-color-primary);
  background: var(--lglg-color-primary-soft);
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
}

.lglg-desc-check-item h3,
.lglg-desc-format-card h3,
.lglg-desc-steps h3 {
  margin: 0;
  color: var(--lglg-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

.lglg-desc-check-item p,
.lglg-desc-renew p,
.lglg-desc-format-card p,
.lglg-desc-steps p,
.lglg-desc-duration-grid p,
.lglg-desc-faq p,
.lglg-desc-info p {
  margin: 6px 0 0;
  color: var(--lglg-muted);
  font-size: 12px;
  line-height: 1.6;
}

.lglg-desc-info {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 18px 20px;
  color: var(--lglg-text);
  background: var(--lglg-color-primary-soft);
  border: 1px solid var(--lglg-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.lglg-desc-info-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  color: var(--lglg-color-primary);
  background: var(--lglg-bg-card);
  border-radius: 50%;
  font-weight: 700;
}

.lglg-desc-info strong {
  color: var(--lglg-text);
  font-size: 13px;
}

.lglg-desc-renew {
  display: grid;
  gap: 16px;
}

.lglg-desc-button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 10px 17px;
  color: var(--lglg-color-secondary-text);
  background: var(--lglg-color-secondary);
  border: 1px solid var(--lglg-color-secondary);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
}

.lglg-desc-button:hover,
.lglg-desc-button:focus {
  color: var(--lglg-color-secondary-text);
  background: #0f9a9a;
  border-color: #0f9a9a;
  text-decoration: none;
}

.lglg-desc-section-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-end;
  margin-bottom: 20px;
}

.lglg-desc-note {
  max-width: 360px;
  color: var(--lglg-muted);
  font-size: 11px;
  line-height: 1.5;
  text-align: right;
}

.lglg-desc-format-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.lglg-desc-format-card {
  min-width: 0;
  overflow: hidden;
  color: var(--lglg-text);
  background: var(--lglg-bg-card);
  border: 1px solid var(--lglg-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.lglg-desc-card-header {
  min-height: 54px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--lglg-border);
}

.lglg-desc-card-title {
  margin: 0;
  color: var(--lglg-text);
  font-size: 14px;
  font-weight: 700;
}

.lglg-desc-card-body {
  padding: 17px 16px;
}

.lglg-desc-card-body > strong {
  display: block;
  min-height: 40px;
  color: var(--lglg-text);
  font-size: 14px;
  line-height: 1.4;
}

.lglg-desc-status {
  flex: 0 0 auto;
  display: inline-flex;
  padding: 5px 8px;
  border-radius: 6px;
  font-size: 9px;
  font-weight: 600;
}

.lglg-desc-status--automatic {
  color: var(--lglg-color-secondary);
  background: rgba(20, 184, 184, 0.1);
}

.lglg-desc-status--assisted {
  color: var(--lglg-color-primary);
  background: var(--lglg-color-primary-soft);
}

.lglg-desc-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lglg-desc-steps li {
  min-width: 0;
  text-align: center;
}

.lglg-desc-step-number {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  margin: 0 auto 12px;
  color: var(--lglg-color-primary);
  background: var(--lglg-color-primary-soft);
  border: 1px solid var(--lglg-border);
  border-radius: 50%;
  font-size: 11px;
  font-weight: 700;
}

.lglg-desc-duration-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.lglg-desc-duration-grid article {
  padding: 16px;
  color: var(--lglg-text);
  background: var(--lglg-bg-card);
  border: 1px solid var(--lglg-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.lglg-desc-duration-grid article > span {
  color: var(--lglg-muted);
  font-size: 10px;
  font-weight: 500;
}

.lglg-desc-duration-grid strong {
  display: block;
  margin-top: 4px;
  color: var(--lglg-text);
  font-size: 24px;
  line-height: 1.2;
}

.lglg-desc-duration-grid .lglg-desc-is-featured {
  color: #ffffff;
  background: var(--lglg-color-primary);
  border-color: var(--lglg-color-primary);
}

.lglg-desc-duration-grid .lglg-desc-is-featured > span,
.lglg-desc-duration-grid .lglg-desc-is-featured strong,
.lglg-desc-duration-grid .lglg-desc-is-featured p {
  color: #ffffff;
}

.lglg-desc-faq {
  display: grid;
  gap: 9px;
}

.lglg-desc-faq details {
  color: var(--lglg-text);
  background: var(--lglg-bg-card);
  border: 1px solid var(--lglg-border);
  border-radius: 10px;
}

.lglg-desc-faq summary {
  padding: 14px 16px;
  cursor: pointer;
  color: var(--lglg-text);
  font-size: 13px;
  font-weight: 600;
}

.lglg-desc-faq p {
  padding: 0 16px 15px;
  margin: 0;
}

.lglg-desc-links {
  width: 100%;
  margin-top: 24px;
  padding: 20px;
  color: var(--lglg-text);
  background: var(--lglg-bg-card);
  border: 1px solid var(--lglg-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.lglg-desc-links > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.lglg-desc-links a {
  display: inline-flex;
  align-items: center;
  padding: 8px 10px;
  color: var(--lglg-text);
  background: var(--lglg-bg-card);
  border: 1px solid var(--lglg-border);
  border-radius: 8px;
  font-size: 11px;
  font-weight: 500;
  text-decoration: none;
}

.lglg-desc-links a:hover {
  color: var(--lglg-color-primary);
  border-color: var(--lglg-color-primary);
  text-decoration: none;
}

@media (max-width: 1100px) {
  .lglg-desc-quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .lglg-desc-layout,
  .lglg-desc-format-grid {
    grid-template-columns: 1fr;
  }

  .lglg-desc-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 14px;
  }

  .lglg-desc-duration-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .lglg-desc-quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .lglg-desc-quick-card {
    min-height: 104px;
    padding: 13px;
  }

  .lglg-desc-panel,
  .lglg-desc-section,
  .lglg-desc-info {
    padding: 18px;
  }

  .lglg-desc-section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .lglg-desc-note {
    text-align: left;
  }

  .lglg-desc-steps {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .lglg-desc-steps li {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    text-align: left;
  }

  .lglg-desc-step-number {
    margin: 0;
  }

  .lglg-desc-links {
    padding: 18px;
  }
}
/* P6 quick-nav: neutralise le soulignement du theme (angartheme.css) sur les
   cartes de navigation uniquement. Specificite superieure, sans !important.
   Anneau de focus :focus-visible inchange (accessibilite preservee). */
body.product-id-6#product #content-wrapper #tab-content .product-description a.lglg-desc-quick-card,
body.product-id-6#product #content-wrapper #tab-content .product-description a.lglg-desc-quick-card:hover,
body.product-id-6#product #content-wrapper #tab-content .product-description a.lglg-desc-quick-card:active {
  text-decoration: none;
}
/* P6 support card body — scoped to body.product-id-6. */
body.product-id-6 .lglg-desc-support > p {
  margin: 12px 0 0;
  color: var(--lglg-muted);
  font-size: 14px;
  line-height: 1.6;
}
/* P6 support list rows v2 — LOCAL PREVIEW ONLY (not deployed).
   v1 lost the cascade: theme #product #content-wrapper #tab-content ul
   (angartheme.css, specificity 3,0,1) beat body.product-id-6
   .lglg-desc-support-list (0,2,1) -> native disc bullets + 16px indent live.
   Fix: same #product chain the quick-nav override uses (3,3,2), no !important.
   Label/value gap 2px -> 4px for clear separation (Metronic hierarchy). */

body.product-id-6#product #content-wrapper #tab-content .product-description ul.lglg-desc-support-list {
  display: grid;
  gap: 0;
  margin: 14px 0 0;
  padding-left: 0;
  list-style: none;
}

body.product-id-6 .lglg-desc-support-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 10px 0;
  border-top: 1px solid var(--lglg-border);
}

body.product-id-6 .lglg-desc-support-item:first-child {
  padding-top: 2px;
  border-top: 0;
}

body.product-id-6 .lglg-desc-support-icon {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  color: var(--lglg-color-primary);
  background: var(--lglg-color-primary-soft);
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
}

body.product-id-6 .lglg-desc-support-item strong {
  display: block;
  color: var(--lglg-text);
  font-size: 13px;
  line-height: 1.4;
}

body.product-id-6 .lglg-desc-support-text {
  display: block;
  margin-top: 4px;
  color: var(--lglg-muted);
  font-size: 12px;
  line-height: 1.6;
}
/**
 * DreamTV editorial slot styles (LOCAL CANDIDATE - append to
 * dreamtv-product-description.css at deploy time, NOT a new file).
 * Styles the optional BO-fed intro block. Same tokens as the existing file.
 * Scoped to body.product-id-6. No !important. No configurator selectors.
 */
body.product-id-6 .lglg-desc-editorial {
  margin: 0 0 24px;
  padding: 18px 20px;
  color: var(--lglg-text);
  background: var(--lglg-bg-card);
  border: 1px solid var(--lglg-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  font-size: 14px;
  line-height: 1.6;
}
body.product-id-6 .lglg-desc-editorial p {
  margin: 0 0 10px;
  color: var(--lglg-text);
  font-size: 14px;
  line-height: 1.6;
}
body.product-id-6 .lglg-desc-editorial p:last-child {
  margin-bottom: 0;
}
body.product-id-6 .lglg-desc-editorial h3 {
  margin: 0 0 8px;
  color: var(--lglg-text);
  font-size: 15px;
  font-weight: 700;
}
body.product-id-6 .lglg-desc-editorial ul {
  margin: 0 0 10px;
  padding-left: 20px;
}
body.product-id-6 .lglg-desc-editorial a {
  color: var(--lglg-color-primary);
}

/* Approved DreamTV canvas bridge: keep the page shell aligned with the
   shared description canvas without changing the global body or shared CSS. */
body.product-id-6 #description {
  background: #ffffff;
}

/* Approved white-canvas correction (DreamTV ID 6 only): the shared
   description canvas paints .lglg-desc lavender; on DreamTV the canvas
   must stay white while cards keep their hierarchy. Scoped selector
   (0,2,1) beats the shared canvas rule (0,1,0) with no !important.
   Placed after the lavender canvas bridge rule. No global impact. */
body.product-id-6 .lglg-desc {
  background: #ffffff;
}
/* DreamTV Metronic polish P6-SCOPED deploy variant (generated mechanically from approved source
   sha256 6028a871b37eca486e0f99749c103a08fddcb22c13ad58c93cad99c5387c0d28).
   Every selector prefixed with body.product-id-6 (including :disabled).
   Visual-only: six approved refinements, no layout/content/JS changes. */

/* 1. Metronic card-header: hairline rule + rhythm under section heads. */
body.product-id-6 .lglg-desc-section-head {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--lglg-border);
  align-items: flex-start;
}

/* 2. Metronic list-widget dividers: dashed separators for secondary rows. */
body.product-id-6 .lglg-desc-check-item + .lglg-desc-check-item, body.product-id-6 .lglg-desc-support-item + .lglg-desc-support-item {
  border-top-style: dashed;
}

/* 3. Readability: relaxed copy rhythm (sizes untouched). */
body.product-id-6 .lglg-desc-check-item p, body.product-id-6 .lglg-desc-renew p, body.product-id-6 .lglg-desc-format-card p, body.product-id-6 .lglg-desc-steps p, body.product-id-6 .lglg-desc-duration-grid p, body.product-id-6 .lglg-desc-faq p, body.product-id-6 .lglg-desc-info p, body.product-id-6 .lglg-desc-support-text {
  line-height: 1.65;
}

/* 4. Button standard: 46px touch height + disabled state. */
body.product-id-6 .lglg-desc-button {
  min-height: 46px;
}

body.product-id-6 .lglg-desc-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

/* 5. Quick-icon legibility chip. */
body.product-id-6 .lglg-desc-quick-icon {
  width: 36px;
  height: 36px;
  font-size: 12px;
}

/* 6. FAQ open state (Metronic accordion): whisper tint, same border. */
body.product-id-6 .lglg-desc-faq details[open] {
  background: #FBFAFE;
}