.boolean-input{display:inline-flex;align-items:center;margin-right:12px}
.boolean-input .bool-label{display:flex;align-items:center;gap:6px;cursor:pointer;padding:6px 12px;border-radius:8px}
.boolean-input .bool-label input[type="checkbox"]{width:18px;height:18px;accent-color:#22c55e}
.bool-var-badge{font-weight:700;font-size:1rem;color:var(--accent,#C2410C);min-width:20px;text-align:center}
.bool-expr{text-align:center;font-size:1.3rem;font-weight:700;padding:10px;font-family:'Courier New',monospace;color:var(--text,#1E293B);background:var(--bg,#F8FAFF);border:1.5px solid var(--border,#E2E8F0);border-radius:10px;margin-bottom:12px}
.bool-result{font-size:1.5rem;font-weight:800;text-align:center;padding:12px;border-radius:10px;font-family:var(--system-fonts)}


/* Boolean Algebra Laws Table */
.bool-laws-wrap{overflow-x:auto;margin:24px 0}

.bool-laws-table{width:100%;border-collapse:collapse;font-size:.9rem;background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}

.bool-laws-table thead{background:var(--primary);color:#fff}

.bool-laws-table th{padding:14px 16px;text-align:left;font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.05em}

.bool-laws-table td{padding:12px 16px;border-bottom:1px solid var(--border);color:var(--text);vertical-align:top}

.bool-laws-table tbody tr{transition:background .15s ease}

.bool-laws-table tbody tr:hover{background:rgba(37,99,235,.05)}

.bool-laws-table tbody tr:last-child td{border-bottom:none}

.bool-laws-table td:first-child{font-weight:700;white-space:nowrap;color:var(--primary);min-width:140px}

.bool-laws-table td:nth-child(2){font-family:'Courier New',monospace;font-size:.85rem;white-space:nowrap;color:var(--accent);min-width:150px}


/* ============================================================
   BOOLEAN CALCULATOR — Enhanced Styles
   ============================================================ */

.bl-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}


.bl-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.bl-label {
  font-size: .82rem;
  font-weight: 600;
  color: var(--subtext);
}


/* Radio group */
.bl-radio-group {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.bl-radio {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: var(--radius-sm);
  border: 1.5px solid var(--border);
  background: var(--bg);
  font-size: .85rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s ease;
  color: var(--subtext);
  font-family: var(--system-fonts);
}

.bl-radio:has(input:checked) {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

.bl-radio input[type="radio"] { accent-color: var(--primary); }

.bl-radio:has(input:checked) input[type="radio"] { accent-color: #fff; }

.bl-radio:hover:not(:has(input:checked)) {
  border-color: var(--primary);
  color: var(--primary);
}


/* Select */
.bl-select {
  width: 100%;
  padding: 10px 14px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: .9rem;
  font-weight: 600;
  color: var(--text);
  background: var(--card);
  cursor: pointer;
  transition: border-color .2s ease, box-shadow .2s ease;
  font-family: var(--system-fonts);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='%2364748B'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}

.bl-select:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}

.bl-select:hover { border-color: var(--primary); }


[data-theme="dark"] .bl-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='%2394A3B8'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
}


/* Variable checkboxes */
.bl-var-grid {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.bl-var-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: var(--radius-sm);
  border: 1.5px solid var(--border);
  background: var(--bg);
  cursor: pointer;
  transition: all .2s ease;
  position: relative;
}

.bl-var-item:has(input:checked) {
  background: rgba(37,99,235,.1);
  border-color: var(--primary);
  box-shadow: 0 0 0 1px var(--primary);
}

.bl-var-item input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--primary);
  cursor: pointer;
}

.bl-var-badge {
  font-weight: 700;
  font-size: .9rem;
  color: var(--text);
  min-width: 18px;
  text-align: center;
}

.bl-var-item:has(input:checked) .bl-var-badge {
  color: var(--primary);
}


/* Result card */
.bl-result {
  padding: 22px 20px;
  background: var(--bg);
  border-radius: var(--radius);
  border: 1.5px solid var(--border);
  transition: all .35s cubic-bezier(.4,0,.2,1);
  transform-origin: top center;
}

.bl-result.hidden { display: none; }

.bl-result.bl-result--visible {
  animation: pctSlideDown .35s cubic-bezier(.4,0,.2,1);
}


.bl-result-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  gap: 8px;
  flex-wrap: wrap;
}

.bl-result-badge {
  font-size: .6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 3px 8px;
  border-radius: 4px;
  background: rgba(37,99,235,.1);
  color: var(--primary);
  border: 1px solid rgba(37,99,235,.15);
}

.bl-result-actions {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}


.bl-copy-btn {
  font-size: .68rem;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 6px;
  background: var(--card);
  color: var(--subtext);
  border: 1.5px solid var(--border);
  cursor: pointer;
  transition: all .2s ease;
  font-family: var(--system-fonts);
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.bl-copy-btn:hover {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}

.bl-copy-btn--copied {
  background: var(--success) !important;
  color: #fff !important;
  border-color: var(--success) !important;
}


/* Expression */
.bl-expr {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text);
  text-align: center;
  padding: 10px 14px;
  background: var(--card);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  margin-bottom: 10px;
  font-family: 'Courier New', 'SFMono-Regular', monospace;
  word-break: break-word;
}


/* Output */
.bl-out {
  font-size: 1.5rem;
  font-weight: 800;
  text-align: center;
  padding: 14px;
  border-radius: var(--radius-sm);
  margin-bottom: 16px;
  transition: all .3s ease;
}

.bl-out--true {
  color: #059669;
  background: rgba(5,150,105,.08);
  border: 1.5px solid rgba(5,150,105,.2);
}

.bl-out--false {
  color: #dc2626;
  background: rgba(220,38,38,.08);
  border: 1.5px solid rgba(220,38,38,.2);
}


/* Truth table */
.bl-tt-wrap { margin-top: 6px; }

.bl-tt-title {
  font-size: .78rem;
  font-weight: 700;
  color: var(--text);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 8px;
}

.bl-tt-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.bl-tt {
  width: 100%;
  border-collapse: collapse;
  font-size: .88rem;
  text-align: center;
}

.bl-tt th {
  padding: 8px 14px;
  border: 1px solid var(--border);
  background: var(--bg);
  font-weight: 700;
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--subtext);
}

.bl-tt th.bl-tt-out {
  color: var(--primary);
}

.bl-tt td {
  padding: 8px 14px;
  border: 1px solid var(--border);
  color: var(--text);
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
}

.bl-tt td.bl-tt-res {
  font-weight: 700;
  color: var(--primary);
  background: rgba(37,99,235,.04);
}

.bl-tt tr:nth-child(even) td {
  background: rgba(0,0,0,.02);
}

.bl-tt tr:nth-child(even) td.bl-tt-res {
  background: rgba(37,99,235,.06);
}


/* Dark mode */
[data-theme="dark"] .bl-result { background: var(--card); }

[data-theme="dark"] .bl-expr { background: var(--bg); }

[data-theme="dark"] .bl-select { background: var(--bg); }

[data-theme="dark"] .bl-radio { background: var(--card); }

[data-theme="dark"] .bl-var-item { background: var(--card); }

[data-theme="dark"] .bl-copy-btn { background: var(--bg); }


/* Mobile */
@media (max-width: 480px) {
  .bl-result { padding: 14px 12px; }
  .bl-expr { font-size: .95rem; padding: 8px 10px; }
  .bl-out { font-size: 1.2rem; padding: 10px; }
  .bl-radio-group { gap: 5px; }
  .bl-radio { padding: 6px 10px; font-size: .8rem; }
  .bl-var-item { padding: 6px 10px; }
  .bl-tt { font-size: .8rem; }
  .bl-tt th, .bl-tt td { padding: 6px 8px; }
}