/* Curtain Customizer Styles */
.curtain-customizer-container {
    max-width: 700px;
    margin: 0 auto 16px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 24px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}
.curtain-form-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid #f0f0f0;
}
.measure-help-text { color:#4792d8; font-size:16px; font-weight:500; flex:1; cursor:pointer; }
.unit-selection { display:flex; gap:8px; }
.unit-option { display:flex; align-items:center; cursor:pointer; position:relative; }
.unit-option input[type="radio"] {
    appearance:none; width:20px; height:20px; border:2px solid #d9d9d9; border-radius:50%; margin-right:4px; position:relative;
}
.unit-option input[type="radio"]:checked { border-color:#4792d8; background:#4792d8; }
.unit-option input[type="radio"]:checked::after {
    content:''; width:8px; height:8px; background:#fff; border-radius:50%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
}
.unit-label { font-size:14px; color:#333; margin-right:12px; }

.measurement-section { display:flex; gap:16px; margin-bottom:24px; }
.measurement-group { flex:1; position:relative; }
.measurement-label { display:block; font-size:16px; font-weight:500; color:#333; margin-bottom:8px; }
.measurement-inputs { display:flex; gap:8px; align-items:center; }
.width-input, .drop-input {
    flex:1; padding:12px 16px; border:1px solid #d9d9d9; border-radius:4px; font-size:16px; outline:none; transition:border-color .3s;
}
.width-input:focus, .drop-input:focus { border-color:#4792d8; box-shadow:0 0 0 2px rgba(71,146,216,.1); }
.fraction-select { padding:12px; border:1px solid #d9d9d9; border-radius:4px; font-size:16px; background:#fff; cursor:pointer; min-width:80px; transition:all .3s; }
.unit-cm .fraction-select.inch-only, .unit-mm .fraction-select.inch-only { display:none; }
.error-message { position:absolute; top:100%; left:0; right:0; background:#fff2f0; color:#ff4d4f; padding:8px; border:1px solid #ffccc7; border-radius:4px; font-size:14px; margin-top:4px; z-index:10; }

.configuration-section { margin-bottom:24px; }
.config-group { margin-bottom:16px; padding:16px 0; border-bottom:1px solid #f0f0f0; }
.config-group:last-child { border-bottom:none; }
.config-label-wrapper { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.config-label { font-size:14px; font-weight:500; color:#555; }
.help-link { color:#4792d8; text-decoration:none; font-size:12px; display:flex; align-items:center; }
.help-link:hover { text-decoration:underline; }
.help-link::before { content:'ℹ'; margin-right:4px; font-weight:bold; }

.rk-cc-total-row { font-size:18px; margin-top:8px; padding:12px 0; border-top:1px dashed #e5e5e5; }

@media (max-width: 768px) {
  .curtain-customizer-container { padding:16px; margin:0 16px; }
  .curtain-form-header { flex-direction:column; gap:12px; text-align:center; }
  .measurement-section { flex-direction:column; gap:20px; }
}
@media (max-width: 480px) {
  .unit-selection { flex-direction:column; gap:8px; }
  .measurement-inputs { flex-direction:column; gap:8px; }
  .fraction-select { min-width:100%; }
}


/* ---------- Help Modal ---------- */
.rk-cc-modal { position: fixed; inset: 0; display:none; z-index: 9999; }
.rk-cc-modal.is-open { display:block; }
.rk-cc-modal__backdrop { position:absolute; inset:0; background: rgba(0,0,0,.45); }
.rk-cc-modal__dialog { position: relative; width: min(860px, 92vw); max-height: 86vh; margin: 6vh auto; background:#fff; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,.2); display:flex; flex-direction:column; }
.rk-cc-modal__close { position:absolute; top:10px; right:12px; background:transparent; border:none; font-size:22px; cursor:pointer; }
.rk-cc-modal__content { padding: 20px 24px; overflow:auto; }
.rk-cc-modal__footer { padding: 12px 16px; border-top:1px solid #eee; display:flex; justify-content:flex-end; }
.rk-cc-modal__btn { padding:8px 14px; border:1px solid #d0d0d0; background:#f9f9f9; border-radius:6px; cursor:pointer; }

/* Guide grid */
.rk-cc-guide-tip { color:#555; margin-top:0; }
.rk-cc-guide-grid { display:grid; grid-template-columns: repeat(2, 1fr); gap: 24px; padding: 10px 0 4px; }
.rk-cc-guide-card { border:1px solid #eee; border-radius:8px; padding:14px; text-align:center; }
.rk-cc-guide-title { font-size:18px; font-weight:600; margin-top:8px; }
.rk-cc-guide-svg { width:100%; height:120px; }
@media (max-width: 560px){
  .rk-cc-guide-grid { grid-template-columns: 1fr; }
}