/* ==========================================================
   Boddor GWS Checkout — Device Information (Standard / MAG)
   - Matches BGC single-card neutral theme
========================================================== */


/* Typography: use the active theme font (no custom fonts) */
.bgcdi-card,
.bgcdi-card *{
  font-family: inherit !important;
}
.bgcdi-card{width:100%;}

.bgcdi-head{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.bgcdi-title{margin:0;color: var(--bgccou-text, #000);font: inherit;}
.bgcdi-sub{margin:0;color: var(--bgccou-muted, #6b7280);font: inherit;font-size:12px !important;line-height:1.35;}

.bgcdi-toggle{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin: 10px 0 12px;
}
.bgcdi-btn{
  width:100%;
  background:#fff !important;
  border:1px solid var(--bgccou-card-border, #e5e7eb) !important;
  box-shadow:none !important;
  border-radius: var(--bgccou-choice-radius, 14px) !important;

  padding: clamp(10px, 1vw, 12px) !important;
  min-height: clamp(54px, 6.5vw, 64px);

  display:flex;
  align-items:center;
  justify-content:center;

  /* Match Devices typography (same as .bgccou-device-count) */
  font: inherit !important;
  /* Ensure font shorthand doesn't override weight */
  font-weight: 600 !important;
  font-size: clamp(13px, 1.5vw, 15px) !important;
  line-height: 1.05 !important;
  color: var(--bgccou-text, #000) !important;
  letter-spacing: 0 !important;

  cursor:pointer;
  transition: border-color .18s ease, background .18s ease, transform .08s ease, color .18s ease;
}
.bgcdi-btn:hover{
  transform: translateY(-1px);
}
.bgcdi-btn:active{
  transform: translateY(0);
}

/* Active card look (match Devices/Durations) */
.bgcdi-btn.is-active{
  border-color: var(--bgccou-active-border, #e11d2e) !important;
  background: var(--bgccou-active-bg, #fff3f4) !important;
  color: var(--bgccou-active-text, #e11d2e) !important;
}

/* Check icon (shown only when selected) */
.bgcdi-check-icon{
  display:none;
  width:18px;
  height:18px;
  line-height:0;
}
.bgcdi-btn.is-active .bgcdi-check-icon{
  display:inline-flex;
  color: var(--bgccou-primary, #e11d2e);
}
.bgcdi-check-icon svg{
  width:18px;
  height:18px;
  fill: currentColor;
  display:block;
}


.bgcdi-field .woocommerce-input-wrapper{display:block;}
.bgcdi-field label{font-weight:800;color:#111827;}

#bgcdi-card label.bgcdi-field-label .bgcdi-field-help{
  display:block;
  margin-top:.35em;
  font: inherit;
  font-size: 12px;
  font-weight:400;
  line-height:1.35;
  color: var(--bgccou-muted, #6b7280);
}

.bgcdi-field input.bgcdi-input{
  border:1px solid #e5e7eb !important;
  border-radius:12px !important;
  padding:12px 14px !important;
  background:#fff !important;
  box-shadow:none !important;
}
.bgcdi-field input.bgcdi-input:focus{
  border-color:#ef4444 !important;
  outline:none !important;
  box-shadow:0 0 0 3px rgba(239,68,68,.12) !important;
}

.bgcdi-hint{
  margin: 12px 0 0;
  padding:12px 12px;
  border:1px solid #e5e7eb;
  background:#f9fafb;
  border-radius:12px;
  font-size:13px;
  line-height:1.45;
  color:#111827;
}
.bgcdi-hint strong{font-weight:900;}


/* Accordion (Note: Which device to select?) */
details.bgcdi-acc{ cursor: default; }
details.bgcdi-acc > summary{
  list-style:none;
  cursor:pointer;
}
details.bgcdi-acc > summary::-webkit-details-marker{ display:none; }

.bgcdi-acc-title{
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.bgcdi-acc-title::after{
  content:"›";
  transform: rotate(90deg);
  font-size:18px;
  line-height:1;
  color:#6b7280;
}
details.bgcdi-acc[open] .bgcdi-acc-title::after{
  transform: rotate(-90deg);
}
.bgcdi-acc-body{
  margin-top:10px;
}



.bgcdi-note-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
  margin-top:10px;
}

.bgcdi-note-col{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:16px;
}
.bgcdi-note-title{margin:0 0 10px;color: var(--bgccou-text, #000);font: inherit;}
.bgcdi-note-list{line-height: 1.6;font: inherit;}
.bgcdi-note-title{
  font-weight:800;
  margin:0 0 6px;
  color:#111827;
}
.bgcdi-note-list{
  color:#374151;
}
.bgcdi-break{display:block;height:6px;}
.bgcdi-list{display:block;color:#374151;}

/* Keep Standard / MAG buttons 50% width on all devices */

@media (max-width: 767px){
  .bgcdi-note-grid{display:grid !important; grid-template-columns:1fr !important;}
}


/* Note link (toggle) under helper */
details.bgcdi-note-details{ margin-top: -8px; }
details.bgcdi-note-details > summary{
  list-style: none;
  cursor: pointer;
}
details.bgcdi-note-details > summary::-webkit-details-marker{ display:none; }

.bgcdi-note-link{
  display: inline-block;
  color: var(--bgccou-active-border, #e11d2e);
  text-decoration: none;
  font: inherit;
  font-weight: 900;
  font-size: 13px;
}

details.bgcdi-note-details[open] .bgcdi-note-link{
  text-decoration: underline;
}

/* Note box spacing */
.bgcdi-note-box{ margin-top: 10px; }



/* Label + helper text (Device Information field) — clean, theme-friendly */
#bgcdi-card label[for="renew_order"]{
  margin-bottom: .7em !important;
  font: inherit !important;
  font-family: inherit !important;
  color: var(--bgccou-text, #000) !important;
}

/* Emphasis only for the (extending/renewing) part */
#bgcdi-card label[for="renew_order"] .bgcdi-renew-accent{
  color: var(--bgccou-active-badge-bg, var(--bgccou-primary, #dc2626)) !important;
  font-weight: 600 !important;
  font-family: inherit !important;
}