.bcw-modal { position: fixed; inset: 0; background: #000000bd; display: none; align-items: center; justify-content: center; z-index: 99999; color: #fff; }
.bcw-modal.active { display: flex; }
.bcw-modal .bcw-modal__dialog { background: #111; width: 860px; max-width: 95vw; border-radius: 8px; box-shadow: 0 12px 32px rgba(0,0,0,0.25); color: #fff; }
.bcw-modal__header, .bcw-modal__footer { padding: 32px; border-bottom: 1px solid #333; }
.bcw-modal__header { position: relative; display: flex; justify-content: space-between; align-items: flex-start; }
.bcw-modal__header-content { flex: 1; }
.bcw-modal__close { 
    background: none; 
    border: none; 
    color: #fff; 
    font-size: 24px; 
    cursor: pointer; 
    padding: 0; 
    width: 30px; 
    height: 30px; 
    display: flex; 
    align-items: center; 
    justify-content: center;
    border-radius: 4px;
    transition: background-color 0.2s;
}
.bcw-modal__close:hover { background-color: rgba(255, 255, 255, 0.1); }
.bcw-modal__footer { padding:16px; border-bottom: 0; display: flex; justify-content: space-between; gap: 8px; }
.bcw-modal__body { padding: 16px; max-height: 70vh; overflow: auto; }
.bcw-total { font-weight: 600; text-align: right; }
.bcw-steps-progress { display: flex; gap: 8px; margin-bottom: 12px; }
.bcw-step-pill { padding: 6px 10px; border-radius: 999px; background: #1f2937; color: #fff; }
.bcw-step-pill.active { background: #ffffff; color: #000000; }
.bcw-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.bcw-card { border: 1px solid #333; border-radius: 6px; padding: 10px; margin-top: 16px; }
.bcw-card .bcw-card__title { font-weight: 600; margin-bottom: 6px; }
.bcw-step-content { padding: 24px 48px; }
.bcw-cancel { padding: 16px 32px; border-radius: 32px; background: transparent; color: #fff; border:none; }
.bcw-done { padding: 16px 32px; border-radius: 32px; border:none; }
.bcw-prev { padding: 16px 32px; border-radius: 32px; background: transparent; color: #fff; border:none; }
.bcw-next { padding: 16px 32px; border-radius: 32px; background: white; color: #000000; border:none; }

.bcw-cart-step-name { color: grey; }

button:disabled { opacity: 0.5; cursor: not-allowed; }
/* Dropdown styling */
.bcw-dropdown {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #333;
    border-radius: 8px;
    background: transparent;
    color: #fff;
    font-size: 16px;
}

.bcw-dropdown:focus {
    outline: none;
    border-color: #fff;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.2);
}

.bcw-dropdown option {
    padding: 12px 16px;
    background: #1f2937;
    color: #fff;
    border: none;
}

.bcw-option-description {
    font-size: 14px;
    color: #9ca3af;
    margin-top: 4px;
    font-style: italic;
}

/* Product Configuration Modal Styles */
.bcw-attr-section {
    margin-bottom: 20px;
    padding: 15px;
    background: #1f2937;
    border-radius: 8px;
    border: 1px solid #374151;
}

.bcw-attr-section h4 {
    margin: 0 0 12px 0;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
}

.bcw-terms-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bcw-term-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #374151;
    border-radius: 6px;
    border: 1px solid #4b5563;
    cursor: pointer;
    transition: all 0.2s;
}

.bcw-term-option:hover {
    background: #4b5563;
    border-color: #6b7280;
}

.bcw-term-option input[type="radio"],
.bcw-term-option input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
}

.bcw-term-name {
    flex: 1;
    font-size: 14px;
    color: #fff;
}

.bcw-term-option:has(input:checked) {
    background: #059669;
    border-color: #10b981;
}

.bcw-term-option:has(input:checked) .bcw-term-name {
    font-weight: 600;
}