/* Able Dynamic Inquiry Builder - Frontend Premium Styles with Floating Label */
/* ========================================   
BASE FORM STYLES   
======================================== */
.field-label{display:block;margin-bottom:8px;font-size:14px;font-weight:600;color:#333}
.able-dib-form{display:flex;flex-direction:column;gap:10px}
.able-dib-recaptcha-notice{margin:-8px 0 0;font-size:12px;color:#64748b;text-align:right}

/* ========================================   
FIELD GROUPS & GRID SYSTEM   
======================================== */
.able-dib-field-group{position:relative;display:flex;flex-direction:column;gap:8px;width:100%;transition:all 0.2s ease;flex-wrap:wrap;box-sizing:border-box;padding:0 4px}
.able-dib-field-group.type-hidden{display:none !important}
/* Grid System */
.step-fields-inner{display:flex;flex-wrap:wrap;margin:0 -4px;gap:10px 0px;}
.able-dib-field-group.col-100{flex:0 0 100%;width:100%}
.able-dib-field-group.col-50{flex:0 0 50%;width:50%}
.able-dib-field-group.col-33{flex:0 0 33.333%;width:33.333%}
.able-dib-field-group.col-25{flex:0 0 25%;width:25%}
/* Position: Left */
.able-dib-field-group.position-left{flex-direction:row;align-items:flex-start;gap:30px}
.able-dib-field-group.position-left > label{flex:0 0 140px;padding-top:12px}
.able-dib-field-group.position-left .field-input-wrapper,.able-dib-field-group.position-left .input-wrapper{flex:1;width:100%}
/* Position: Right */
.able-dib-field-group.position-right{flex-direction:row;align-items:flex-start;gap:30px}
.able-dib-field-group.position-right > label{flex:0 0 140px;padding-top:12px;order:2}
.able-dib-field-group.position-right .field-input-wrapper,.able-dib-field-group.position-right .input-wrapper{flex:1;width:100%;order:1}

/* ========================================   
INPUT WRAPPER (for Floating Label)   
======================================== */
.able-dib-field-group .input-wrapper{position:relative}

/* ========================================   
FORM INPUTS - FLOATING LABEL STYLE   
======================================== */
.able-dib-form input[type="text"],.able-dib-form input[type="email"],.able-dib-form input[type="tel"],.able-dib-form input[type="date"],.able-dib-form input[type="password"],.able-dib-form input[type="number"],.able-dib-form input[type="url"],.able-dib-form textarea{width:100%;height:45px;border-radius:8px;border:1px solid #E5E5E5;background-color:#FFF;color:#666;font-weight:400;line-height:130%;transition:all 0.2s;box-sizing:border-box;font-family:inherit;font-size:16px;padding:20px 16px 6px;caret-color:#111827}
.able-dib-form input::placeholder,.able-dib-form textarea::placeholder{color:transparent}
.able-dib-form select{padding:12px 40px 12px 16px;font-size:14px;appearance:none;background:#FFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='23' viewBox='0 0 23 23' fill='none'%3E%3Cpath d='M5.5 15L11.5 8L17.5 15' stroke='%23CCCCCC' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center / 24px;cursor:pointer;height:45px;border-radius:8px;border:1px solid #E5E5E5;color:#666;font-weight:400;line-height:130%;transition:all 0.2s;box-sizing:border-box;font-family:inherit;width:100%}
.able-dib-form textarea{height:90px;resize:none;}
.able-dib-form input:focus,.able-dib-form textarea:focus{outline:none;border-color:#56ACFF;background-color:#FFF}
.able-dib-form select:focus{outline:none;border-color:#56ACFF}
.able-dib-form input.complete,.able-dib-form textarea.complete{border-color:#CFE2FF}
.able-dib-form select.complete{border-color:#CFE2FF}

/* ========================================   
CUSTOM SELECT DROPDOWN
======================================== */
.able-dib-custom-select{position:relative;width:100%}
.able-dib-custom-select .able-dib-select-value{position:absolute;width:1px !important;height:1px !important;opacity:0;pointer-events:none;padding:0 !important;border:0 !important}
.able-dib-select-trigger{width:100%;min-height:45px;padding:12px 44px 12px 16px;border:1px solid #E5E5E5;border-radius:8px;background:#FFF;color:#999;font-size:16px;line-height:130%;text-align:left;cursor:pointer;box-sizing:border-box;transition:all .2s;position:relative}
.able-dib-select-trigger:after{content:"";position:absolute;right:14px;top:50%;width:24px;height:24px;transform:translateY(-50%);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6.5 9.58301L11.5 15.4163L16.5 9.58301' stroke='%23999999' stroke-width='1.33333' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/24px;transition:transform .2s}
.able-dib-custom-select.is-open .able-dib-select-trigger:after{transform:translateY(-50%) rotate(180deg)}
.able-dib-select-trigger:hover,.able-dib-select-trigger:focus{outline:none;border-color:#56ACFF}
.able-dib-custom-select.is-selected .able-dib-select-trigger{border-color:#CFE2FF;color:#666;}

/* 드롭다운 메뉴 */
.able-dib-select-dropdown{position:absolute;top:calc(100%);left:0;right:0;z-index:10000;background:#fff;border:1px solid #E5E5E5;border-radius:8px;height:0;max-height:200px;padding:12px;overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-8px);transition:all .2s ease}
.able-dib-custom-select.is-open .able-dib-select-dropdown{height:auto; opacity:1;visibility:visible;transform:translateY(0)}
/* 위쪽으로 표시 */
.able-dib-select-dropdown.is-position-top{top:auto;bottom:calc(100%);transform:translateY(8px)}
.able-dib-custom-select.is-open .able-dib-select-dropdown.is-position-top{transform:translateY(0)}
/* 드롭다운 옵션 */
.able-dib-select-option{padding:9.5px 12px;color:#999;border-radius: 4px;font-size:16px;line-height:1.3;cursor:pointer;transition:all .15s;}
.able-dib-select-option:hover,.able-dib-select-option:focus,.able-dib-select-option.is-selected{background: rgba(86, 172, 255, 0.80);color:#fff;font-weight:800}
/* 선택 완료 상태 */
.able-dib-custom-select.is-selected .able-dib-select-trigger{background: #FFF; border-color:#CFE2FF}

/* Placeholder 옵션: 선택 전에는 숨김, 선택 후에만 표시 */
.able-dib-select-option.is-placeholder{display:none;}
.able-dib-custom-select.is-selected .able-dib-select-option.is-placeholder{display:block;}

/* Error State */
.able-dib-form input.able-dib-input-error,.able-dib-form input.able-dib-input-error:focus,.able-dib-form textarea.able-dib-input-error,.able-dib-form textarea.able-dib-input-error:focus{border-color:#EB1E1E}
.able-dib-form select.able-dib-input-error,.able-dib-form select.able-dib-input-error:focus{border-color:#EB1E1E}

/* Custom Select Error State */
.able-dib-custom-select.has-error .able-dib-select-trigger{border-color:#EB1E1E}
.able-dib-custom-select.has-error .able-dib-select-trigger:focus{border-color:#EB1E1E}

/* Disabled State */
.able-dib-form input:disabled,.able-dib-form textarea:disabled{background:#E7E7E7;border-color:#E7E7E7;color:rgba(51, 51, 51, 0.20);cursor:not-allowed}
.able-dib-form select:disabled{background:#E7E7E7;border-color:#E7E7E7;color:rgba(51, 51, 51, 0.20);cursor:not-allowed}
.able-dib-form input:disabled ~ .floating-label{color:#ccc}



/* ========================================   
FLOATING LABEL   
======================================== */
.able-dib-form .floating-label{position:absolute;top:12px;left:16px;pointer-events:none;transition:all 0.2s ease;z-index:2;color:#999;font-size:16px;font-weight:400;line-height:130%}
/* Focus or Has Value State */
.able-dib-field-group .input-wrapper.is-active .floating-label{transform:translateY(-50%);font-size:9px; background:#fff;}
/* 크롬 autofill 대응 - 모든 필드 타입 */
.able-dib-form input:-webkit-autofill,
.able-dib-form input[type="text"]:-webkit-autofill,
.able-dib-form input[type="email"]:-webkit-autofill,
.able-dib-form input[type="tel"]:-webkit-autofill,
.able-dib-form input[type="date"]:-webkit-autofill,
.able-dib-form input[type="password"]:-webkit-autofill,
.able-dib-form input[type="number"]:-webkit-autofill,
.able-dib-form input[type="url"]:-webkit-autofill,
.able-dib-form textarea:-webkit-autofill,
.able-dib-form select:-webkit-autofill,
.able-dib-form input:-webkit-autofill:hover,
.able-dib-form input[type="text"]:-webkit-autofill:hover,
.able-dib-form input[type="email"]:-webkit-autofill:hover,
.able-dib-form input[type="tel"]:-webkit-autofill:hover,
.able-dib-form input[type="date"]:-webkit-autofill:hover,
.able-dib-form input[type="password"]:-webkit-autofill:hover,
.able-dib-form input[type="number"]:-webkit-autofill:hover,
.able-dib-form input[type="url"]:-webkit-autofill:hover,
.able-dib-form textarea:-webkit-autofill:hover,
.able-dib-form select:-webkit-autofill:hover,
.able-dib-form input:-webkit-autofill:focus,
.able-dib-form input[type="text"]:-webkit-autofill:focus,
.able-dib-form input[type="email"]:-webkit-autofill:focus,
.able-dib-form input[type="tel"]:-webkit-autofill:focus,
.able-dib-form input[type="date"]:-webkit-autofill:focus,
.able-dib-form input[type="password"]:-webkit-autofill:focus,
.able-dib-form input[type="number"]:-webkit-autofill:focus,
.able-dib-form input[type="url"]:-webkit-autofill:focus,
.able-dib-form textarea:-webkit-autofill:focus,
.able-dib-form select:-webkit-autofill:focus,
.able-dib-form input:-webkit-autofill:active,
.able-dib-form input[type="text"]:-webkit-autofill:active,
.able-dib-form input[type="email"]:-webkit-autofill:active,
.able-dib-form input[type="tel"]:-webkit-autofill:active,
.able-dib-form input[type="date"]:-webkit-autofill:active,
.able-dib-form input[type="password"]:-webkit-autofill:active,
.able-dib-form input[type="number"]:-webkit-autofill:active,
.able-dib-form input[type="url"]:-webkit-autofill:active,
.able-dib-form textarea:-webkit-autofill:active,
.able-dib-form select:-webkit-autofill:active {
    box-shadow: 0 0 0 1000px #fff inset !important;
    -webkit-text-fill-color: #666 !important;
    color: #666 !important;
    transition: background-color 5000s ease-in-out 0s;
}
/* autofill 되었을 때 label 올라가게 */
.able-dib-form input:-webkit-autofill + .floating-label,
.able-dib-form textarea:-webkit-autofill + .floating-label {
    transform: translateY(-50%);
    font-size: 10px;
}

/* Disable floating label for date input */
.able-dib-form input[type="date"]{padding:10px 16px;}
.able-dib-form input[type="date"] ~ .floating-label,
.able-dib-form input[type="date"]:focus ~ .floating-label,
.able-dib-form input[type="date"].is-active ~ .floating-label,
.able-dib-form .input-wrapper:has(input[type="date"]) .floating-label{display:none}

/* ========================================   
CHECKBOX & RADIO GROUPS   
======================================== */
.able-dib-field-group.layout-full-row.position-top{flex-direction:column}
.able-dib-checkbox-group,.able-dib-radio-group{display:flex;flex-wrap:wrap;gap:10px;width:100%}
.type-checkbox:first-child{padding-top:12px;}
.able-dib-checkbox-group label.cb-label,.able-dib-radio-group label.rd-label{display:inline-flex;align-items:center;flex-wrap:wrap;background:#ffffff;font-size:14px;color:#999;font-weight: 400;line-height: 130%;cursor:pointer;transition:all 0.2s;margin:0;box-sizing:border-box}
/* Wide fill only for single agreements */
.able-dib-field-group.has-single-opt .able-dib-checkbox-group label.cb-label,.able-dib-field-group.has-single-opt .able-dib-radio-group label.rd-label{flex:1 1 100%;width:100%}

/* Custom Checkbox & Radio Styles */
.able-dib-checkbox-group label.cb-label input[type="checkbox"],
.able-dib-radio-group label.rd-label input[type="radio"]{appearance: none;-webkit-appearance: none;-moz-appearance: none;width: 12px;height: 12px;margin: 0 8px 0 0;border: 1px solid #E5E5E5;border-radius: 2px;background: #FFF;cursor: pointer;position: relative;flex-shrink: 0;}

/* Radio specific - make it circular */
.able-dib-radio-group label.rd-label input[type="radio"]{border-radius: 50%;}

/* Checked state background */
.able-dib-checkbox-group label.cb-label input[type="checkbox"]:checked,
.able-dib-radio-group label.rd-label input[type="radio"]:checked{background: #56ACFF;border-color: #56ACFF;}

/* Checkbox checkmark icon */
.able-dib-checkbox-group label.cb-label input[type="checkbox"]:checked::after{content: "";position: absolute; left: 3px; top: 0px;width: 3px;height: 6px;border: solid #FFF;border-width: 0 1.5px 1.5px 0;transform: rotate(45deg);}

/* Radio inner dot */
.able-dib-radio-group label.rd-label input[type="radio"]:checked::after{content: "";position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%); width: 4px;height: 4px;background: #FFF;border-radius: 50%;}
.able-dib-checkbox-group label.cb-label i,.able-dib-radio-group label.rd-label i{padding-right:4px;color:#56ACFF;}
.able-dib-checkbox-group label.cb-label strong,.able-dib-radio-group label.rd-label strong{padding:0 4px;font-weight:400;text-decoration-line: underline;}
.able-dib-field-group.has-error .able-dib-checkbox-group input[type="checkbox"],
.able-dib-field-group.has-error .able-dib-radio-group input[type="radio"]{border-color:#EB1E1E;background:#FFF5F5;box-shadow:0 0 0 3px rgba(235,30,30,.08)}

/* Multiple Options (Button/Tag style) */
.able-dib-field-group.has-multiple-opts .able-dib-checkbox-group ,.able-dib-field-group.has-multiple-opts .able-dib-radio-group{}
.able-dib-field-group.has-multiple-opts .able-dib-checkbox-group label,.able-dib-field-group.has-multiple-opts .able-dib-radio-group label{position:relative; flex:1; background:#ffffff;border:1px solid #E5E5E5;padding:13.5px 16px;border-radius:8px;font-weight:400;font-size:16px; line-height:130%;transition:all 0.2s;user-select:none;display:inline-flex;align-items:center;justify-content: center;color:#999;flex-shrink:0; text-align:center;}
.able-dib-field-group.has-multiple-opts .able-dib-checkbox-group label:hover,.able-dib-field-group.has-multiple-opts .able-dib-radio-group label:hover{border-color:#56ACFF;background:#F1F8FF;color:#666;}
.able-dib-field-group.has-multiple-opts label:has(input:checked), .able-dib-field-group.has-multiple-opts label:has(input:checked):hover{border-color:#56ACFF;background:#F1F8FF;color:#666;}

/* 자식 개수에 따른 넓이 조정
2개일 때: 각 50% 
3개일 때: 각 33.333%
4개 이상일때 균등분배 */
.able-dib-field-group.has-multiple-opts .able-dib-checkbox-group label:nth-last-child(2):first-child,
.able-dib-field-group.has-multiple-opts .able-dib-checkbox-group label:nth-last-child(2):first-child ~ label,
.able-dib-field-group.has-multiple-opts .able-dib-radio-group label:nth-last-child(2):first-child,
.able-dib-field-group.has-multiple-opts .able-dib-radio-group label:nth-last-child(2):first-child ~ label{flex:0 0 calc(50% - 5px);width:calc(50% - 5px)}

.able-dib-field-group.has-multiple-opts .able-dib-checkbox-group label:nth-last-child(3):first-child,
.able-dib-field-group.has-multiple-opts .able-dib-checkbox-group label:nth-last-child(3):first-child ~ label,
.able-dib-field-group.has-multiple-opts .able-dib-radio-group label:nth-last-child(3):first-child,
.able-dib-field-group.has-multiple-opts .able-dib-radio-group label:nth-last-child(3):first-child ~ label{flex:0 0 calc(33.333% - 6.666px);width:calc(33.333% - 6.666px)}

/* Hide checkbox in multiple options mode */
.able-dib-field-group.has-multiple-opts .able-dib-checkbox-group label input, .able-dib-field-group.has-multiple-opts .able-dib-radio-group label input{position:absolute;top:50%;left:50%;width:1px;height:1px;padding:0;margin:0;border:0;opacity:0;transform:translate(-50%, -50%);}


/* ========================================   
ERROR MESSAGE (Toast Style)   
======================================== */
.able-dib-form .error-message{position:absolute;top:100%;left:50%;transform:translate(-50%, -50%);width:max-content;max-width:90%;background:#333;backdrop-filter:blur(1px);color:#fff;padding:8px 12px;border-radius:8px;font-size:12px;line-height:130%;z-index:9999;display:none;align-items:center;gap:8px;opacity:0}
.able-dib-form .error-message.show{display:flex;animation:toastSlideUp .3s ease-out forwards, toastFadeOut .3s ease-in forwards;animation-delay:0s, 2s}
.able-dib-form .error-message:before{content:"";display:block;width:16px;height:16px;background:url(/wp-content/plugins/able-dynamic-inquiry-builder/assets/images/ico_toast_error.webp) no-repeat center/cover}
.able-dib-form .error-message.success:before{content:"";display:block;width:16px;height:16px;background:url(/wp-content/plugins/able-dynamic-inquiry-builder/assets/images/ico_toast_check.webp) no-repeat center/cover}
@keyframes toastSlideUp{from { opacity:0;transform:translate(-50%, -40%)} to{opacity:1;transform:translate(-50%, -50%)}}
@keyframes toastFadeOut{to { opacity:0;transform:translate(-50%, -40%);visibility:hidden}}

/* Custom Select Error Message */
.able-dib-custom-select + .error-message{position:absolute;top:100%;left:50%;transform:translate(-50%, -50%);}

/* ========================================   
SUBMIT BUTTON   
======================================== */
.able-dib-submit-row{margin-top:14px}
.able-dib-form button[type="submit"],.submit-button, .able-dib-next-step{display:block;width:100%;margin:0px auto;padding:12px 24px;background:#56ACFF;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:800;line-height:130%;cursor:pointer;transition:all 0.2s;text-align:center}
.able-dib-form button[type="submit"]:disabled,.submit-button:disabled, .able-dib-next-step:disabled{background:#E7E7E7;color:rgba(51, 51, 51, 0.20);cursor:not-allowed}

/* ========================================   
SUBMIT FIELD WRAPPER (Step 모드에서 이전/다음 버튼과 함께 사용)
======================================== */
.able-dib-submit-field-wrapper{display:flex;gap:12px; flex-direction:column; width:100%;text-align:center;margin-top:12px;}
.able-dib-step-navigation{display:flex;gap:12px;}
.able-dib-prev-step{background:#fff;color:#CCC;text-align: center;font-size: 14px;cursor:pointer;font-weight: 600;line-height: 130%; text-decoration-line: underline;}

/* ========================================   
PROGRESS BAR   
======================================== */
.able-dib-progress-container.simple-style{margin-bottom:30px;background:transparent;border:none;padding:0}
.able-dib-progress-info{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;font-size:14px;color:#999;line-height:130%}
.current-step-label{font-size:14px;font-weight:600;color:#666}
.current-step-text{font-size:14px;font-weight:400;color:#999}
.able-dib-progress-bar-bg{height:4px;background:#E5E5E5;border-radius:2px;overflow:hidden}
.able-dib-progress-bar-fill{height:100%;border-radius:2px;background:linear-gradient(90deg, #56EEFF 0%, #6E76FF 100%);transition:width 0.3s ease}

/* ========================================   
LOADING OVERLAY   
======================================== */
.able-dib-loading-overlay{position:absolute;top:50%;left:50%;width:100%;height:100%;transform:translate(-50%, -50%);background:rgba(255, 255, 255, 0.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:none !important;flex-direction:column;align-items:center;justify-content:center;z-index:1000;border-radius:20px;opacity:0;visibility:hidden;transition:opacity 0.4s ease}
.able-dib-loading-overlay.active{display:flex !important;opacity:1;visibility:visible}
.able-dib-spinner{width:50px;height:50px;border:4px solid rgba(0, 0, 0, 0.05);border-left-color:#56ACFF;border-radius:50%;animation:able-dib-spin 1s linear infinite;margin-bottom:20px}
@keyframes able-dib-spin{to { transform:rotate(360deg)}}
.able-dib-loading-text{font-weight:600;color:#1e293b;font-size:1.1rem}

/* ========================================   
MODAL SYSTEM (ui_modal - able-kr-remotecall-trial-plugin 스타일)
======================================== */
/* 기존 모달 시스템 제거/대체 */
.able-dib-modal-container{display:none !important}

/* 새로운 ui_modal 시스템 */
.ui_modal.able-dib-modal{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999;height:100%;display:none;justify-content:center;align-items:center;opacity:0;transition:opacity .25s ease}
.ui_modal.able-dib-modal.active{display:flex;opacity:1}
.ui_modal.able-dib-modal .ui_modal_dim{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.6);touch-action:none}
.ui_modal.able-dib-modal .ui_modal_layer{position:relative;width:calc(100% - 32px);max-width:480px;z-index:2}
.ui_modal.able-dib-modal .ui_modal_container{position:relative;padding-top:42.5px;background:#fff;border-radius:16px;overflow:hidden}
.ui_modal.able-dib-modal .ui_modal_header{padding-bottom:20px}
.ui_modal.able-dib-modal .ui_modal_header .tit{color:#333;font-size:24px;font-weight:800;line-height:120%}
.ui_modal.able-dib-modal .ui_modal_body{max-height:80vh;padding:0px 28px 28px 28px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.ui_modal.able-dib-modal .ui_modal_close{position:absolute;top:25px;right:25px;width:24px;height:24px;border:0;font-size:0;background:url(/wp-content/uploads/image/common/sms_close_icon.svg) no-repeat center/24px;cursor:pointer; z-index: 1;}
body.ui_modal_lock{overflow:hidden}
/* 스크롤바 막대 커스텀 적용 */
.ui_modal ::-webkit-scrollbar {width: 4px;}
.ui_modal ::-webkit-scrollbar-thumb {background: #E0E0E0;border-radius: 2px;}
.ui_modal ::-webkit-scrollbar-track {background: transparent;}
/* 스크롤바 버튼(상하좌우 화살표) 완전 제거 */
.ui_modal ::-webkit-scrollbar-button {display: none !important;width: 0 !important;height: 0 !important;background: transparent !important;border: none !important;box-shadow: none !important;}


/* ========================================   
SUCCESS MODAL (ui_modal 스타일)
======================================== */
.ui_modal.able-dib-success-modal{z-index:100000}
.ui_modal.able-dib-success-modal .ui_modal_layer{max-width:425px}
.ui_modal.able-dib-success-modal .ui_modal_container{padding:24px;border-radius:16px}
.ui_modal.able-dib-success-modal .modal-icon{margin-bottom:18px}
.ui_modal.able-dib-success-modal .modal-title{font-size:24px;font-weight:800;line-height:1.3;color:#333;margin:0 0 12px;}
.ui_modal.able-dib-success-modal .modal-message{color:#666;font-size:16px;line-height:1.3;margin-bottom:36px;}
.ui_modal.able-dib-success-modal .modal-confirm-btn{background:#56ACFF;color:#ffffff;border:none;padding:12px 24px;border-radius:8px;font-size:16px;font-weight:800;line-height: 130%;cursor:pointer;transition:all 0.3s;width:100%}

/* ========================================   
STANDALONE SUCCESS MODAL
======================================== */
.able-dib-standalone-success-modal{position:fixed;top:0;left:0;right:0;bottom:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;opacity:1;visibility:visible;pointer-events:auto}
.able-dib-standalone-success-dim{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.6)}
.able-dib-standalone-success-layer{position:relative;width:calc(100% - 32px);max-width:425px;z-index:1}
.able-dib-standalone-success-container{position:relative;padding:28px;border-radius:16px;background:#fff;box-sizing:border-box;}
.able-dib-standalone-success-modal .modal-icon{margin-bottom:18px}
.able-dib-standalone-success-modal .modal-title{font-size:24px;font-weight:800;line-height:1.3;color:#333;margin:0 0 12px;}
.able-dib-standalone-success-modal .modal-message{color:#666;font-size:16px;line-height:1.3;margin-bottom:36px;}
.able-dib-standalone-success-modal .modal-confirm-btn{background:#56ACFF;color:#fff;border:0;padding:12px 24px;border-radius:8px;font-size:16px;font-weight:800;line-height: 130%;cursor:pointer;width:100%;transition:all 0.3s}

/* ========================================   
FORCE SUCCESS MODAL
======================================== */
.able-dib-force-success-modal{position:fixed;inset:0;z-index:2147483647;display:flex;align-items:center;justify-content:center;opacity:1;visibility:visible;pointer-events:auto}
.able-dib-force-success-dim{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.able-dib-force-success-layer{position:relative;z-index:1;width:calc(100% - 32px);max-width:425px}
.able-dib-force-success-box{box-sizing:border-box;background:#fff;border-radius:16px;padding:28px;box-shadow: 0 2px 8px 0 rgba(51, 51, 51, 0.20);}
.able-dib-force-success-icon{margin-bottom:18px}
.able-dib-force-success-icon .dashicons{font-size:30px;width:30px;height:30px;color:#4caf50}
.able-dib-force-success-box h3{font-size:24px;font-weight:800;color:#333;margin:0 0 12px;}
.able-dib-force-success-message{color:#666;font-size:16px;line-height:1.3;margin-bottom:36px;}
.able-dib-force-success-box button{width:100%;border:0;border-radius:8px;background:#56ACFF;color:#fff;padding:12px 24px;font-size:16px;font-weight:800;line-height: 130%;cursor:pointer;transition:all 0.3s}


/* ========================================   
TRIGGER BUTTONS   
======================================== */
.able-dib-trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:#56ACFF;color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;text-decoration:none;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);box-shadow:0 4px 15px rgba(86, 172, 255, 0.2)}
.able-dib-trigger:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(86, 172, 255, 0.3);color:#fff;opacity:0.95}
.able-dib-trigger.is-link{background:transparent;color:#56ACFF;padding:0;border-radius:0;box-shadow:none;font-weight:500;border-bottom:1px solid transparent}
.able-dib-trigger.is-link:hover{transform:none;box-shadow:none;color:#4A9BE8;border-bottom-color:#4A9BE8;opacity:1}
.able-dib-trigger.is-floating{position:fixed;bottom:30px;right:30px;z-index:9999;padding:16px 28px;border-radius:50px;font-size:17px;box-shadow:0 10px 30px rgba(86, 172, 255, 0.4)}

/* ========================================   
FILE UPLOAD   
======================================== */
.able-dib-file-upload-wrapper{width:100%}
.file-drop-zone{position:relative;border:2px dashed #cbd5e1;border-radius:12px;padding:30px 20px;text-align:center;background:#f8fafc;transition:all 0.3s ease;cursor:pointer;overflow:hidden}
.file-drop-zone:hover, .file-drop-zone.drag-over{border-color:#56ACFF;background:rgba(86, 172, 255, 0.04)}
.file-drop-zone .dashicons-upload{font-size:42px;width:42px;height:42px;color:#64748b;margin-bottom:12px;transition:transform 0.3s ease}
.file-drop-zone:hover .dashicons-upload{transform:translateY(-5px);color:#56ACFF}
.file-instruction{font-weight:600;color:#334155;margin:0 0 8px 0;font-size:15px}
.file-specs{font-size:12px;color:#94a3b8;margin:0}
.able-dib-file-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:2}
.file-list-preview{margin-top:15px}
.file-item{display:flex;align-items:center;padding:10px 15px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;margin-bottom:8px;animation:slideInUp 0.3s ease-out}
.file-item .file-ext-icon{width:36px;height:36px;background:#f1f5f9;color:#56ACFF;display:flex;align-items:center;justify-content:center;border-radius:6px;margin-right:12px;font-weight:800;font-size:10px;text-transform:uppercase}
.file-item .file-info{flex:1;min-width:0}
.file-item .file-name{display:block;font-size:14px;font-weight:600;color:#1e293b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-item .file-size{display:block;font-size:12px;color:#64748b}
.file-item .remove-file{background:none;border:none;color:#94a3b8;cursor:pointer;padding:5px;transition:color 0.2s}
.file-item .remove-file:hover{color:#ef4444}
@keyframes slideInUp{from { opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)}}

/* ========================================   
COMPANY AUTOCOMPLETE   
======================================== */
.able-dib-autocomplete-container{position:relative;width:100%}
.able-dib-autocomplete-dropdown{position:absolute;top:100%;left:0;right:0;width:100%;box-sizing:border-box;z-index:10000;margin-top:8px;background:rgba(255, 255, 255, 0.9) !important;backdrop-filter:blur(20px) !important;-webkit-backdrop-filter:blur(20px) !important;border:1px solid rgba(255, 255, 255, 0.4) !important;border-radius:12px !important;box-shadow:0 15px 35px rgba(0, 0, 0, 0.1), 0 5px 15px rgba(0, 0, 0, 0.05) !important;max-height:380px;overflow:hidden;padding:8px 8px 0;display:none;animation:ableDibFadeIn 0.3s cubic-bezier(0.16, 1, 0.3, 1)}
@keyframes ableDibFadeIn{from { opacity:0;transform:translateY(-10px)} to{opacity:1;transform:translateY(0)}}
.able-dib-autocomplete-dropdown.is-searching{opacity:0.7;pointer-events:none}
.able-dib-autocomplete-dropdown::-webkit-scrollbar{width:4px}
.able-dib-autocomplete-dropdown::-webkit-scrollbar-track{background: transparent;}
.able-dib-autocomplete-dropdown::-webkit-scrollbar-thumb{background: #E0E0E0;border-radius: 2px;}
.able-dib-autocomplete-dropdown::-webkit-scrollbar-button {display: none !important;width: 0 !important;height: 0 !important;background: transparent !important;border: none !important;box-shadow: none !important;}
.able-dib-autocomplete-item{padding:12px 16px;min-height:64px;border-radius:8px;cursor:pointer;transition:all 0.2s ease;border-bottom:1px solid rgba(0,0,0,0.03);display:flex;flex-direction:column;gap:6px}
.able-dib-autocomplete-item:last-child{border-bottom:none}
.able-dib-autocomplete-item:hover,.able-dib-autocomplete-item.is-selected{background:linear-gradient(135deg, rgba(86, 172, 255, 0.08), rgba(120, 80, 240, 0.04));transform:translateX(4px)}
.able-dib-autocomplete-item .item-company{font-weight:700;color:#1a1b1e;font-size:15px;display:flex;align-items:center;gap:8px}
.able-dib-autocomplete-item .item-company .listed-badge{font-size:10px;background:#eef2ff;color:#6366f1;padding:2px 6px;border-radius:4px;font-weight:600}
.able-dib-autocomplete-item .item-info{font-size:12px;color:#6e7681;line-height:1.4}
.able-dib-autocomplete-item .item-info.one-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.able-dib-autocomplete-results{max-height:256px;overflow-y:auto;overflow-x:hidden;padding-bottom:8px}
.able-dib-autocomplete-results::-webkit-scrollbar{width:4px}
.able-dib-autocomplete-results::-webkit-scrollbar-track{background: transparent;}
.able-dib-autocomplete-results::-webkit-scrollbar-thumb{background:r#E0E0E0;border-radius:2px}
.able-dib-autocomplete-results::-webkit-scrollbar-button {display: none !important;width: 0 !important;height: 0 !important;background: transparent !important;border: none !important;box-shadow: none !important;}
.able-dib-autocomplete-footer{position:sticky;bottom:0;margin:0 -8px;padding:8px;background:rgba(255, 255, 255, 0.96);border-top:1px solid rgba(0,0,0,0.06);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.able-dib-direct-input-btn{width:100%;border:0;border-radius:10px;padding:12px 14px;background:#111827;color:#ffffff;font-size:13px;font-weight:700;cursor:pointer;text-align:center}
.able-dib-direct-input-btn:hover,.able-dib-direct-input-btn:focus{background:#1f2937}
.able-dib-autocomplete-empty{padding:18px 14px 14px;color:#6b7280;font-size:13px;text-align:center}
.able-dib-autocomplete-loading{padding:20px;text-align:center;color:#6366f1;font-size:13px;font-weight:500}

@media (max-width:640px){
    .able-dib-autocomplete-dropdown { margin-top:4px;max-height:min(240px, calc(100vh - 96px))} 
    .able-dib-autocomplete-results{max-height:min(176px, calc(100vh - 160px))}
    .able-dib-select-dropdown{max-height:200px}
    .able-dib-select-dropdown.is-position-top{max-height:200px}
}

/* ========================================   
STEP TRANSITIONS   
========================================mode-popup */
.mode-inline .step-fields-inner{margin: 0 -6px;}
.mode-inline .able-dib-field-group{padding: 0 6px;}
.pt10{padding-top:10px;}
.pt20{padding-top:20px;}
.mode-inline .able-dib-checkbox-group, .mode-inline .able-dib-radio-group{justify-content: center;}
.mode-inline .able-dib-field-group.has-single-opt .able-dib-checkbox-group label.cb-label, .mode-inline .able-dib-field-group.has-single-opt .able-dib-radio-group label.rd-label{flex:none;width:auto;}
.mode-inline .able-dib-form button[type="submit"], .mode-inline .submit-button{max-width:fit-content;min-width: 220px;}

.mode-popup .step-fields-inner{margin:0;}
.mode-popup .able-dib-field-group{padding:0;}


/* Step container - Grid로 카드 겹침 */
.mode-flow-control{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;width:100%;min-height:430px;perspective:1000px}
.mode-flow-control .able-dib-step-pane{display:flex; flex-direction: column; justify-content: space-between; grid-column:1;grid-row:1;width:100%;min-height:430px;box-sizing: border-box;padding: 24px 32px;border-radius: 20px;background: #FFF;box-shadow: 0 2px 8px 0 rgba(51, 51, 51, 0.20);transition:all 0.5s cubic-bezier(0.4, 0, 0.2, 1);transform-origin:center center;opacity:1;visibility:visible;margin-top:0}

.able-dib-step-pane[data-step="1"]{z-index:2;transform:translateY(0) scale(1)}
.able-dib-step-pane[data-step="2"]{z-index:1;transform:translateY(-30px) scale(0.95)}
.able-dib-step-pane[data-step="3"],.able-dib-step-pane[data-step="4"],.able-dib-step-pane[data-step="5"]{z-index:0;transform:translateY(-20px) scale(0.9);opacity:0.7}
.able-dib-step-pane.exiting{transform:translateY(30px) scale(0.95);opacity:0;z-index:1}
.able-dib-step-pane.active{z-index:3;transform:translateY(0) scale(1);opacity:1}

/* Slide Transition */
.able-dib-form[data-transition="slide"] .able-dib-step-pane.anim-next{animation:able-premium-slide-next 0.5s cubic-bezier(0.23, 1, 0.32, 1)}
.able-dib-form[data-transition="slide"] .able-dib-step-pane.anim-prev{animation:able-premium-slide-prev 0.5s cubic-bezier(0.23, 1, 0.32, 1)}
@keyframes able-premium-slide-next{from { opacity:0;transform:translateX(30px)} to{opacity:1;transform:translateX(0)}}
@keyframes able-premium-slide-prev{from { opacity:0;transform:translateX(-30px)} to{opacity:1;transform:translateX(0)}}

/* Conversational Transition */
.able-dib-form[data-transition="conversational"] .able-dib-step-pane{animation:able-premium-conversational 0.5s cubic-bezier(0.23, 1, 0.32, 1)}
@keyframes able-premium-conversational{from { opacity:0;transform:translateY(25px)} to{opacity:1;transform:translateY(0)}}

/* Flip Transition */
.able-dib-form[data-transition="flip"]{perspective:1800px}
.able-dib-form[data-transition="flip"] .able-dib-step-pane{transform-origin:center right;animation:able-premium-flip 0.65s cubic-bezier(0.23, 1, 0.32, 1)}
@keyframes able-premium-flip{from { opacity:0;transform:rotateY(-12deg) translateZ(-40px)} to{opacity:1;transform:rotateY(0) translateZ(0)}}

/* Zoom Transition */
.able-dib-form[data-transition="zoom"] .able-dib-step-pane{animation:able-premium-zoom 0.55s cubic-bezier(0.34, 1.56, 0.64, 1)}
@keyframes able-premium-zoom{from { opacity:0;transform:scale(0.85)} to{opacity:1;transform:scale(1)}}

/* Staggered Transition */
.able-dib-form[data-transition="staggered"] .able-dib-step-pane .able-dib-field-group{opacity:0;transform:translateY(15px);animation:able-premium-staggered 0.45s cubic-bezier(0.23, 1, 0.32, 1) forwards}
.able-dib-form[data-transition="staggered"] .able-dib-step-pane .able-dib-field-group:nth-child(1){animation-delay:0.05s}
.able-dib-form[data-transition="staggered"] .able-dib-step-pane .able-dib-field-group:nth-child(2){animation-delay:0.12s}
.able-dib-form[data-transition="staggered"] .able-dib-step-pane .able-dib-field-group:nth-child(3){animation-delay:0.19s}
.able-dib-form[data-transition="staggered"] .able-dib-step-pane .able-dib-field-group:nth-child(4){animation-delay:0.26s}
.able-dib-form[data-transition="staggered"] .able-dib-step-pane .able-dib-field-group:nth-child(5){animation-delay:0.33s}
@keyframes able-premium-staggered{to { opacity:1;transform:translateY(0)}}

/* ========================================   
ERROR HIGHLIGHTS   
======================================== */
.able-dib-input-error{border-color:rgba(235, 30, 30, 0.60);background:#fff;}
.able-dib-error-hint{color:#EB1E1E;font-size:12px;font-weight:600;margin-top:6px;display:block}

/* ========================================   
RESPONSIVE   
======================================== */
@media (max-width: 640px){
    .able-dib-field-group.col-50, .able-dib-field-group.col-33, .able-dib-field-group.col-25 { flex:0 0 100%;width:100%;} 
    .able-dib-field-group.position-left{flex-direction:column;gap:6px} 
    .able-dib-field-group.position-left > label{flex:0 0 auto;width:100%;max-width:100%;padding-top:0} 
    .able-dib-field-group.position-right{flex-direction:column;gap:6px} 
    .able-dib-field-group.position-right > label{flex:0 0 auto;width:100%;max-width:100%;padding-top:0;order:1} 
    .able-dib-field-group.position-right .input-wrapper{order:2} 
    .ui_modal.able-dib-modal .ui_modal_layer{width:calc(100% - 24px);max-width:none}
    .ui_modal.able-dib-modal .ui_modal_container{padding-top:20px}
    .ui_modal.able-dib-success-modal .ui_modal_container{padding:30px 20px}
    .able-dib-trigger.is-floating{bottom:20px;right:20px;padding:14px 22px;font-size:15px}

    .able-dib-field-group{padding:0;}
    .mode-flow-control{min-height:auto;height:auto;grid-template-rows:auto;align-items:start}
    .mode-flow-control .able-dib-step-pane{min-height:auto;height:auto;padding: 20px 16px;border-radius: 12px;align-self:stretch}
    .step-fields-inner{margin:0; gap:10px;}

    .mode-inline .step-fields-inner{gap:10px 0;margin: 0px;}
    .mode-inline .able-dib-field-group{padding: 0px;}
    .mode-inline .able-dib-checkbox-group, .able-dib-radio-group{justify-content:start;}
    .mode-inline .able-dib-form button[type="submit"], .mode-inline .submit-button{max-width:100%;min-width: 220px;}

    .ui_modal.able-dib-modal .ui_modal_body{padding:0px 20px 28px 20px;}
    .pt20{padding-top:10px;}


}


/* Privacy modal z-index - show above inquiry modal */
#ui_modal_privacy,.agree_modal {z-index: 999999 !important;}
#ui_modal_privacy .ui_modal_dim,.agree_modal .ui_modal_dim {z-index: 999998 !important;}
#ui_modal_privacy .ui_modal_layer,.agree_modal .ui_modal_layer {z-index: 999999 !important;}
