/* ======================================================================
   DjimlyStore Digital v2.26.7 — Compact Streaming Checkout
   - Smaller Streaming service cards and selected-plan card
   - Required phone brand/model input on Streaming plans
====================================================================== */

/* Keep streaming detail content comfortably narrow instead of filling the phone. */
html body #djs-portal #djs-screen-product.djs-streaming-service-list-v21810 .djs-content-wrap,
html body #djs-portal #djs-screen-product.djs-streaming-plan-detail-v21810 .djs-content-wrap {
  width:min(760px,100%) !important;
}
html body #djs-portal #djs-screen-product.djs-streaming-plan-detail-v21810 .djs-product-hero {
  width:min(760px,100%) !important;
  padding-bottom:10px !important;
}
html body #djs-portal .djs-stream-plan-hero-v21810 {
  height:132px !important;
  max-height:132px !important;
  border-radius:16px !important;
  box-shadow:0 7px 20px rgba(15,23,42,.05) !important;
}
html body #djs-portal .djs-stream-plan-hero-v21810 img {
  padding:8px !important;
}

/* Compact the plan list cards before opening a plan. */
html body #djs-portal .djs-stream-list-v21810 { gap:14px !important; }
html body #djs-portal .djs-stream-row-v21810 {
  min-height:116px !important;
  padding:13px 15px !important;
  grid-template-columns:86px minmax(0,1fr) 126px !important;
  gap:14px !important;
  border-radius:20px !important;
  box-shadow:0 7px 20px rgba(15,23,42,.045) !important;
}
html body #djs-portal .djs-stream-row-media-v21810 {
  width:86px !important;
  height:86px !important;
  border-radius:16px !important;
  padding:6px !important;
}
html body #djs-portal .djs-stream-row-copy-v21810 > b { font-size:16px !important; }
html body #djs-portal .djs-stream-row-copy-v21810 > em { font-size:11.5px !important; }
html body #djs-portal .djs-stream-row-side-v21810 > strong { font-size:20px !important; }

/* Selected-plan white card: considerably shorter/cleaner than the previous layout. */
html body #djs-portal .djs-stream-plan-card-v21810 {
  padding:17px 18px !important;
  border-radius:22px !important;
  box-shadow:0 8px 22px rgba(15,23,42,.05) !important;
}
html body #djs-portal .djs-stream-plan-chips-v21810 {
  gap:8px !important;
  margin-bottom:12px !important;
}
html body #djs-portal .djs-stream-plan-chips-v21810 > span {
  min-height:32px !important;
  padding:5px 10px !important;
  font-size:12px !important;
}
html body #djs-portal .djs-stream-plan-price-v21810 {
  min-height:66px !important;
  padding:9px 12px !important;
  border-radius:15px !important;
  gap:10px !important;
}
html body #djs-portal .djs-stream-plan-price-v21810 > b { font-size:14px !important; }
html body #djs-portal .djs-stream-plan-price-v21810 strong { font-size:22px !important; }
html body #djs-portal .djs-stream-plan-price-v21810 em { font-size:11.5px !important; }
html body #djs-portal .djs-stream-plan-divider-v21810 { margin:13px 0 !important; }
html body #djs-portal .djs-stream-plan-features-v21810 { gap:7px !important; }
html body #djs-portal .djs-stream-plan-features-v21810 li {
  gap:8px !important;
  font-size:13.5px !important;
  line-height:1.32 !important;
}
html body #djs-portal .djs-stream-plan-features-v21810 li .ms { font-size:16px !important; }
/* Show only the first three rows until Voir plus, saving vertical space. */
html body #djs-portal .djs-stream-plan-card-v21810:not(.is-expanded) .djs-stream-plan-features-v21810 li:nth-child(n+4) { display:none !important; }
html body #djs-portal .djs-stream-more-v21810 {
  margin:7px 0 11px !important;
  font-size:13px !important;
}
html body #djs-portal .djs-stream-plan-know-v21810 {
  margin:0 0 12px !important;
  padding:10px 12px !important;
  border-radius:14px !important;
}
html body #djs-portal .djs-stream-plan-know-v21810 > b { font-size:12.5px !important; }
html body #djs-portal .djs-stream-plan-know-v21810 p {
  margin-top:4px !important;
  font-size:12.5px !important;
  line-height:1.38 !important;
}
html body #djs-portal .djs-stream-plan-add-v21810 {
  min-height:50px !important;
  border-radius:14px !important;
  font-size:15px !important;
}

/* Required phone brand/model field for Streaming products. */
html body #djs-portal .djs-stream-device-field-v2267 {
  margin:12px 0 0 !important;
  padding:11px 12px !important;
  border:1px solid #e4e7ec !important;
  border-radius:15px !important;
  background:#f8fafc !important;
}
html body #djs-portal .djs-stream-device-field-v2267 label {
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  margin:0 0 8px !important;
  color:#111827 !important;
}
html body #djs-portal .djs-stream-device-field-v2267 label > .ms {
  display:grid !important;
  place-items:center !important;
  width:32px !important;
  height:32px !important;
  border-radius:10px !important;
  background:#fff !important;
  border:1px solid #e3e7ed !important;
  color:#d92d2d !important;
  font-size:19px !important;
  flex:0 0 auto !important;
}
html body #djs-portal .djs-stream-device-field-v2267 label span:last-child {
  display:grid !important;
  gap:1px !important;
}
html body #djs-portal .djs-stream-device-field-v2267 label b {
  font-size:12.5px !important;
  line-height:1.2 !important;
  font-weight:900 !important;
}
html body #djs-portal .djs-stream-device-field-v2267 label small {
  color:#7c8594 !important;
  font-size:10.5px !important;
  line-height:1.25 !important;
  font-weight:650 !important;
}
html body #djs-portal #djs-stream-device-model {
  width:100% !important;
  min-height:46px !important;
  border:1.5px solid #d9dee7 !important;
  border-radius:13px !important;
  background:#fff !important;
  color:#111827 !important;
  padding:0 13px !important;
  font:800 14px/1.2 inherit !important;
  outline:none !important;
  box-shadow:none !important;
}
html body #djs-portal #djs-stream-device-model::placeholder { color:#9aa3af !important; opacity:1 !important; }
html body #djs-portal #djs-stream-device-model:focus {
  border-color:#d92d2d !important;
  box-shadow:0 0 0 3px rgba(217,45,45,.10) !important;
}
html body #djs-portal #djs-stream-device-model.is-invalid {
  border-color:#ef4444 !important;
  background:#fff7f7 !important;
  box-shadow:0 0 0 3px rgba(239,68,68,.10) !important;
}

@media (max-width:560px) {
  html body #djs-portal #djs-screen-product.djs-streaming-service-list-v21810 .djs-content-wrap,
  html body #djs-portal #djs-screen-product.djs-streaming-plan-detail-v21810 .djs-content-wrap { padding:7px 12px 24px !important; }
  html body #djs-portal #djs-screen-product.djs-streaming-plan-detail-v21810 .djs-product-hero { padding:3px 12px 9px !important; }
  html body #djs-portal .djs-stream-plan-hero-v21810 { height:104px !important; max-height:104px !important; border-radius:14px !important; }
  html body #djs-portal .djs-stream-plan-card-v21810 { padding:15px 14px !important; border-radius:19px !important; }
  html body #djs-portal .djs-stream-plan-price-v21810 { min-height:61px !important; padding:8px 10px !important; }
  html body #djs-portal .djs-stream-plan-price-v21810 strong { font-size:20px !important; }
  html body #djs-portal .djs-stream-plan-features-v21810 li { font-size:12.5px !important; }
  html body #djs-portal .djs-stream-plan-know-v21810 p { font-size:12px !important; }
  html body #djs-portal .djs-stream-plan-add-v21810 { min-height:48px !important; font-size:14px !important; }

  html body #djs-portal .djs-stream-row-v21810 {
    min-height:98px !important;
    padding:10px !important;
    grid-template-columns:68px minmax(0,1fr) 92px !important;
    gap:9px !important;
    border-radius:17px !important;
  }
  html body #djs-portal .djs-stream-row-media-v21810 { width:68px !important; height:68px !important; border-radius:13px !important; padding:5px !important; }
  html body #djs-portal .djs-stream-row-copy-v21810 > small { font-size:9px !important; }
  html body #djs-portal .djs-stream-row-copy-v21810 > b { font-size:13px !important; }
  html body #djs-portal .djs-stream-row-copy-v21810 > em { font-size:9.5px !important; max-width:145px !important; }
  html body #djs-portal .djs-stream-row-available-v21810 { padding:4px 7px !important; font-size:9.5px !important; }
  html body #djs-portal .djs-stream-row-side-v21810 > strong { font-size:16px !important; }
  html body #djs-portal .djs-stream-row-side-v21810 > em { font-size:9px !important; }
  html body #djs-portal .djs-stream-device-field-v2267 { margin-top:10px !important; padding:9px 10px !important; border-radius:13px !important; }
  html body #djs-portal #djs-stream-device-model { min-height:44px !important; font-size:13px !important; }
}

[data-theme="dark"] #djs-portal .djs-stream-device-field-v2267,
html body[data-theme="dark"] #djs-portal .djs-stream-device-field-v2267 {
  background:#141922 !important;
  border-color:#2a3240 !important;
}
[data-theme="dark"] #djs-portal .djs-stream-device-field-v2267 label,
html body[data-theme="dark"] #djs-portal .djs-stream-device-field-v2267 label { color:#f8fafc !important; }
[data-theme="dark"] #djs-portal #djs-stream-device-model,
html body[data-theme="dark"] #djs-portal #djs-stream-device-model {
  background:#0f141c !important;
  border-color:#303949 !important;
  color:#f8fafc !important;
}