/* ============================================================
   SBC Form – Care Net Conference 2026
   Cornerstone Marketing Strategies
   ============================================================ */

/* --- Wrapper ------------------------------------------------ */
.sbc-form-wrap {
  display: flex;
  flex-wrap: wrap;
  max-width: 960px;
  margin: 0 auto;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,0.22);
  font-family: Arial, Helvetica, sans-serif;
}

/* --- LEFT panel --------------------------------------------- */
.sbc-left {
  flex: 0 0 46%;
  background: #c8ecee;
  display: flex;
  flex-direction: column;
}

.sbc-left-header {
  background: #1a3a5c;
  color: #fff;
  padding: 22px 24px 18px;
  line-height: 1.35;
}

.sbc-get {
  font-family: Georgia, serif;
  font-style: italic;
  color: #65cdd4;
  font-size: 2rem;
  font-weight: 700;
}

.sbc-free {
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: 1px;
}

.sbc-resources {
  font-size: 1.15rem;
  font-weight: 700;
  display: inline-block;
  margin-top: 2px;
}

.sbc-topics {
  color: #65cdd4;
  font-size: 0.82rem;
  font-weight: 700;
  display: block;
}

.sbc-check {
  display: block;
  margin-top: 6px;
  font-size: 1rem;
  font-style: italic;
  color: #fff;
}

.sbc-arrow {
  color: #f0a500;
  font-weight: 900;
  font-style: normal;
  margin-right: 4px;
}

/* --- Checklist --------------------------------------------- */
.sbc-checklist {
  flex: 1;
}

.sbc-check-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 22px;
  border-bottom: 1px solid rgba(255,255,255,0.55);
  cursor: pointer;
  background: #c8ecee;
  transition: background 0.15s;
}

.sbc-check-item:nth-child(even) {
  background: #b5e3e6;
}

.sbc-check-item:hover {
  background: #9fd8dc;
}

/* Hide native checkbox */
.sbc-check-item input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

/* Custom checkbox box */
.sbc-check-box {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border: 2px solid #4a9fa8;
  border-radius: 4px;
  background: #fff;
  margin-top: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, border-color 0.15s;
}

.sbc-check-item input:checked ~ .sbc-check-box {
  background: #1a3a5c;
  border-color: #1a3a5c;
}

.sbc-check-item input:checked ~ .sbc-check-box::after {
  content: '';
  width: 6px;
  height: 11px;
  border: 2px solid #fff;
  border-top: none;
  border-left: none;
  transform: rotate(45deg) translate(-1px, -1px);
  display: block;
}

.sbc-check-label {
  font-size: 0.88rem;
  font-weight: 700;
  color: #1a3a5c;
  line-height: 1.4;
}

/* --- RIGHT panel ------------------------------------------- */
.sbc-right {
  flex: 0 0 54%;
  background: #1a3a5c;
  padding: 30px 28px 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* --- Form fields ------------------------------------------- */
.sbc-row {
  margin-bottom: 12px;
}

.sbc-two-col {
  display: flex;
  gap: 10px;
}

.sbc-two-col .sbc-field {
  flex: 1;
}

.sbc-field input,
.sbc-field textarea {
  width: 100%;
  padding: 11px 14px;
  border: none;
  border-radius: 4px;
  font-size: 0.9rem;
  background: #fff;
  color: #222;
  box-sizing: border-box;
  outline: none;
  transition: box-shadow 0.15s;
}

.sbc-field input::placeholder,
.sbc-field textarea::placeholder {
  color: #888;
}

.sbc-field input:focus,
.sbc-field textarea:focus {
  box-shadow: 0 0 0 3px rgba(101,205,212,0.45);
}

.sbc-field textarea {
  resize: vertical;
  min-height: 70px;
}

/* --- Submit button ------------------------------------------ */
.sbc-submit {
  width: 100%;
  padding: 14px;
  background: #f0a500;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 1px;
  cursor: pointer;
  transition: background 0.2s, opacity 0.2s;
}

.sbc-submit:hover {
  background: #d49200;
}

.sbc-submit:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.sbc-btn-spinner {
  animation: sbc-spin 0.7s linear infinite;
  display: inline-block;
}

@keyframes sbc-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* --- Disclaimer --------------------------------------------- */
.sbc-disclaimer {
  color: rgba(255,255,255,0.7);
  font-size: 0.78rem;
  font-style: italic;
  text-align: center;
  margin: 10px 0 0;
}

/* --- Success / error messages ------------------------------ */
.sbc-success {
  background: rgba(101,205,212,0.2);
  border: 1px solid #65cdd4;
  border-radius: 4px;
  padding: 14px 16px;
  margin-bottom: 16px;
  color: #65cdd4;
  font-weight: 700;
  font-size: 0.95rem;
  text-align: center;
}

.sbc-error {
  background: rgba(220,60,60,0.15);
  border: 1px solid #e06060;
  border-radius: 4px;
  padding: 12px 16px;
  margin-bottom: 14px;
  color: #f08080;
  font-size: 0.88rem;
}

/* --- Responsive -------------------------------------------- */
@media ( max-width: 680px ) {
  .sbc-left,
  .sbc-right {
    flex: 0 0 100%;
  }

  .sbc-two-col {
    flex-direction: column;
    gap: 0;
  }

  .sbc-two-col .sbc-field {
    margin-bottom: 12px;
  }
}