/* ═══ 원격상담 ═══ */

/* 독립 헤더 (consultation/index.php 전용 — 케봇 미포함 사용자) */
.cs-consult-header{min-height:60px;background:linear-gradient(135deg,#F97316,#EA6A0A,#F59E0B);display:flex;align-items:center;justify-content:flex-end;padding:0 12px;flex-shrink:0;position:relative;border-radius:20px 20px 0 0;overflow:hidden}
.cs-consult-header::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);animation:csShine 4s linear infinite;pointer-events:none}
@keyframes csShine{0%{left:-100%}50%{left:100%}51%{left:100%}100%{left:-100%}}
.cs-consult-header-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:1px;pointer-events:none}
.cs-consult-header-sub{font-size:11px;color:rgba(255,255,255,.6);font-weight:500;letter-spacing:.3px}
.cs-consult-header-title{font-size:16px;font-weight:700;color:#fff}

/* 서브탭 (상담 예약 | 예약관리) */
.cs-tabs{display:flex;background:#fff;border-bottom:1px solid #ECECEC;flex-shrink:0}
.cs-tab{flex:1;padding:13px 0;text-align:center;font-size:14px;font-weight:600;color:#9CA3AF;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .15s;font-family:inherit}
.cs-tab.active{color:#F97316;border-bottom-color:#F97316}
.cs-tab:hover:not(.active){color:#6B7280}

/* 바디 */
.cs-body{flex:1;display:flex;flex-direction:column;overflow-y:auto;padding:16px 20px;gap:14px;background:#f8f8fa}
.cs-body::-webkit-scrollbar{width:3px}
.cs-body::-webkit-scrollbar-thumb{background:#C4C4C4;border-radius:3px}

/* 푸터 */
.cs-footer{flex-shrink:0;padding:12px 20px 16px;background:#fff;border-top:1px solid #ECECEC;display:flex;gap:8px;border-radius:0 0 20px 20px}

/* ── 달력 ── */
.cs-cal-header{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:6px}
.cs-cal-nav{width:28px;height:28px;border:none;border-radius:6px;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#374151;font-size:18px;font-weight:700;transition:all .12s;padding:0;line-height:1}
.cs-cal-nav:hover:not(:disabled){color:#F97316;background:#FFF7ED}
.cs-cal-nav:disabled{opacity:.25;cursor:not-allowed}
.cs-cal-month{font-size:16px;font-weight:700;color:#1F2937;letter-spacing:-.2px;min-width:80px;text-align:center}

.cs-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:0}
.cs-cal-dayname{text-align:center;font-size:11px;font-weight:600;color:#9CA3AF;padding:3px 0 5px}
.cs-cal-dayname:first-child{color:#EF4444}
.cs-cal-dayname:last-child{color:#3B82F6}

.cs-cal-day{height:32px;width:32px;margin:0 auto;display:flex;align-items:center;justify-content:center;font-size:12px;border-radius:50%;cursor:pointer;transition:all .1s;color:#374151;position:relative}
.cs-cal-day:hover:not(.disabled):not(.selected){background:#F3F4F6}
.cs-cal-day.other-month:not(.disabled){color:#9CA3AF;cursor:pointer}
.cs-cal-day.other-month.disabled{color:#D1D5DB;pointer-events:none}
.cs-cal-day.disabled{color:#D1D5DB;pointer-events:none}
.cs-cal-day.sunday{color:#EF4444}
.cs-cal-day.sunday.disabled{color:#FCA5A5}
.cs-cal-day.today{font-weight:700}
.cs-cal-day.today::after{content:'';position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:3px;height:3px;border-radius:50%;background:#F97316}
.cs-cal-day.selected{background:#F97316;color:#fff;font-weight:700;box-shadow:0 2px 8px rgba(249,115,22,.38)}
.cs-cal-day.selected::after{display:none}

/* ── 시간 슬롯 ── */
.cs-slot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.cs-slot-btn{padding:9px 4px;text-align:center;font-size:13px;font-weight:600;font-family:inherit;border:1.5px solid #E5E7EB;border-radius:8px;background:#fff;cursor:pointer;color:#374151;transition:all .12s}
.cs-slot-btn:hover:not(.disabled):not(.selected){border-color:#F97316;color:#F97316;background:#FFF7ED}
.cs-slot-btn.selected{background:#F97316;border-color:#F97316;color:#fff;box-shadow:0 2px 8px rgba(249,115,22,.3);transform:scale(1.03)}
.cs-slot-btn.disabled{background:#F9FAFB;color:#D1D5DB;cursor:not-allowed;font-size:12px}

/* ── 폼 필드 ── */
.cs-field{display:flex;flex-direction:column;gap:7px}
.cs-field>label{font-size:13px;font-weight:600;color:#374151;line-height:1.4}
.cs-label-sub{font-weight:400;color:#9CA3AF;font-size:12px}
.cs-field input[type="text"],.cs-field input[type="tel"]{padding:10px 13px;border:1.5px solid #E5E7EB;border-radius:8px;font-size:13px;font-family:inherit;color:#1F2937;outline:none;transition:border .12s}
.cs-field input:focus{border-color:#F97316;box-shadow:0 0 0 3px rgba(249,115,22,.1)}
.cs-field input:disabled,.cs-field input[readonly]{background:#F9FAFB;color:#6B7280;cursor:default;border-color:#E5E7EB}

/* 상담유형 라디오 카드 */
.cs-type-group{display:flex;gap:8px;flex-wrap:wrap}
.cs-type-label{display:flex;cursor:pointer}
.cs-type-label input[type="radio"]{display:none}
.cs-type-card{padding:8px 16px;border:1.5px solid #E5E7EB;border-radius:8px;font-size:13px;font-weight:500;color:#6B7280;background:#fff;transition:all .15s;user-select:none}
.cs-type-label:hover .cs-type-card{border-color:#D1D5DB;color:#374151;background:#F9FAFB}
.cs-type-label input[type="radio"]:checked+.cs-type-card{border-color:#F97316;background:#F97316;color:#fff;font-weight:600}

/* 공지 */
.cs-notice{background:#FFF7ED;border:1px solid #FED7AA;border-radius:8px;padding:10px 13px;font-size:12px;color:#92400E;line-height:1.65}

/* 안내 힌트 */
.cs-hint{padding:14px 0 6px;text-align:center;font-size:13px;color:#9CA3AF}

/* 구분선 */
.cs-divider{height:1px;background:#E5E7EB;margin:2px 0}

/* ── 버튼 ── */
.cs-btn-close{flex:1;padding:11px;background:#F3F4F6;color:#4B5563;font-size:14px;font-weight:600;font-family:inherit;border:1px solid #E5E7EB;border-radius:10px;cursor:pointer;transition:all .12s}
.cs-btn-close:hover{background:#E5E7EB}
.cs-btn-submit{flex:2.5;padding:11px;background:#F97316;color:#fff;font-size:14px;font-weight:700;font-family:inherit;border:none;border-radius:10px;cursor:pointer;transition:all .15s}
.cs-btn-submit:hover{background:#EA6A0A;box-shadow:0 4px 14px rgba(249,115,22,.35)}
.cs-btn-submit:disabled{background:#E5E7EB;color:#9CA3AF;cursor:not-allowed;box-shadow:none}

/* ── 성공 뷰 ── */
.cs-success{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 0;gap:12px;text-align:center}
.cs-success-icon{width:60px;height:60px;background:#ECFDF5;border-radius:50%;display:flex;align-items:center;justify-content:center;animation:csPopIn .35s cubic-bezier(.34,1.56,.64,1)}
@keyframes csPopIn{from{transform:scale(0);opacity:0}}
.cs-success-icon svg{width:28px;height:28px}
.cs-success-title{font-size:17px;font-weight:700;color:#1F2937}
.cs-success-sub{font-size:13px;color:#6B7280;line-height:1.7}
.cs-success-detail{background:#F9FAFB;border:1px solid #E5E7EB;border-radius:8px;padding:14px 16px;width:100%;font-size:13px;line-height:2.1;color:#374151;text-align:left}
.cs-success-detail strong{font-weight:700;color:#F97316}

/* ── 예약관리 탭 ── */
.cs-manage-info{background:#F9FAFB;border-radius:8px;padding:12px 14px;font-size:12px;color:#6B7280;line-height:1.7;margin-bottom:4px}
.cs-m-item{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid #F3F4F6}
.cs-m-item:last-child{border-bottom:none}
.cs-m-date{min-width:56px;text-align:center;border-radius:7px;padding:6px 8px;flex-shrink:0}
.cs-m-date.upcoming{background:#FFF7ED;border:1px solid #FED7AA}
.cs-m-date.past{background:#F9FAFB;border:1px solid #E5E7EB}
.cs-m-date .ym{font-size:10px;font-weight:600}
.cs-m-date.upcoming .ym{color:#EA6A0A}
.cs-m-date.past .ym{color:#9CA3AF}
.cs-m-date .dd{font-size:20px;font-weight:700;line-height:1;margin:2px 0}
.cs-m-date.upcoming .dd{color:#F97316}
.cs-m-date.past .dd{color:#9CA3AF}
.cs-m-date .wd{font-size:10px}
.cs-m-date.upcoming .wd{color:#EA6A0A}
.cs-m-date.past .wd{color:#9CA3AF}
.cs-m-info{flex:1;min-width:0}
.cs-m-time{font-size:15px;font-weight:700;color:#1F2937;letter-spacing:-.2px}
.cs-m-time.muted{color:#9CA3AF}
.cs-m-type{font-size:12px;color:#6B7280;margin-top:2px}
.cs-m-type.muted{color:#D1D5DB}
.cs-m-actions{display:flex;gap:6px;align-items:center;flex-shrink:0}
.cs-badge{font-size:12px;font-weight:600;padding:4px 10px;border-radius:20px;white-space:nowrap}
.cs-badge.confirmed{background:#ECFDF5;color:#059669}
.cs-badge.done{background:#F3F4F6;color:#6B7280}
.cs-cancel-btn{font-size:12px;color:#9CA3AF;background:none;border:1px solid #E5E7EB;border-radius:6px;padding:4px 10px;cursor:pointer;font-family:inherit;transition:all .12s;white-space:nowrap}
.cs-cancel-btn:hover{border-color:#EF4444;color:#EF4444;background:#FEF2F2}

/* 취소 모달 내 닫기 버튼 */
.cs-hdr-btn{width:30px;height:30px;background:#F3F4F6;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .12s;color:#6B7280}
.cs-hdr-btn:hover{background:#E5E7EB;color:#1F2937}
.cs-hdr-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ── 취소 확인 오버레이 ── */
.cs-cancel-overlay{position:absolute;inset:0;background:rgba(0,0,0,.4);z-index:2;display:none;align-items:center;justify-content:center;border-radius:20px}
.cs-cancel-overlay.show{display:flex}
.cs-cancel-box{background:#fff;border-radius:14px;width:340px;box-shadow:0 16px 48px rgba(0,0,0,.18);overflow:hidden;animation:csPopIn .2s ease}
.cs-cancel-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #F3F4F6}
.cs-cancel-title{font-size:15px;font-weight:700;color:#111827}
.cs-cancel-body{padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.cs-cancel-info{background:#F9FAFB;border:1px solid #E5E7EB;border-radius:8px;padding:12px 14px;font-size:13px;color:#374151;line-height:1.9}
.cs-cancel-info .lbl{font-size:11px;color:#9CA3AF;font-weight:500;margin-bottom:4px;display:block}
.cs-cancel-warn{background:#FEF2F2;border:1px solid #FECACA;border-radius:8px;padding:10px 12px;font-size:12px;color:#991B1B;line-height:1.65}
.cs-cancel-footer{padding:0 18px 16px;display:flex;gap:8px}
.cs-btn-back{flex:1;padding:10px;background:#F3F4F6;color:#4B5563;font-size:14px;font-weight:600;font-family:inherit;border:1px solid #E5E7EB;border-radius:8px;cursor:pointer;transition:all .12s}
.cs-btn-back:hover{background:#E5E7EB}
.cs-btn-do-cancel{flex:1.4;padding:10px;background:#FEF2F2;color:#EF4444;font-size:14px;font-weight:700;font-family:inherit;border:1px solid #EF4444;border-radius:8px;cursor:pointer;transition:all .15s}
.cs-btn-do-cancel:hover{background:#EF4444;color:#fff}

/* ── 애니메이션 ── */
@keyframes csReveal{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.cs-animate{animation:csReveal .25s cubic-bezier(.4,0,.2,1) both}

/* SNB 원격상담 버튼 */
.menu-law.menu-consult{background:linear-gradient(135deg,#F97316,#EA6A0A);color:#fff;transition:all .2s}
.menu-law.menu-consult:hover{opacity:.9}
.menu-law.menu-consult.active{box-shadow:0 0 0 2px rgba(249,115,22,.4)}

/* ── 개인정보 동의 오버레이 ── */
.cs-consent-overlay{position:absolute;inset:0;background:rgba(0,0,0,.4);z-index:3;display:none;align-items:center;justify-content:center;border-radius:20px}
.cs-consent-overlay.show{display:flex}
.cs-consent-box{background:#fff;border-radius:14px;width:340px;box-shadow:0 16px 48px rgba(0,0,0,.18);overflow:hidden;animation:csPopIn .2s ease;max-height:90%;overflow-y:auto}
.cs-consent-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #F3F4F6}
.cs-consent-title{font-size:15px;font-weight:700;color:#111827}
.cs-consent-body{padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.cs-consent-summary{font-size:13px;color:#4B5563;line-height:1.6}
.cs-consent-table-wrap{border:1px solid #E5E7EB;border-radius:8px;overflow:hidden}
.cs-consent-table{width:100%;border-collapse:collapse;font-size:12px}
.cs-consent-table th{background:#F9FAFB;padding:9px 12px;text-align:left;font-weight:600;color:#6B7280;border-bottom:1px solid #E5E7EB;white-space:nowrap}
.cs-consent-table td{padding:9px 12px;color:#374151;border-bottom:1px solid #F3F4F6;line-height:1.5;vertical-align:top}
.cs-consent-table tr:last-child td{border-bottom:none}
.cs-consent-notice{background:#F9FAFB;border-radius:7px;padding:10px 13px;font-size:12px;color:#6B7280;line-height:1.65}
.cs-consent-check{display:flex;align-items:center;gap:9px;padding:12px 14px;background:#FFF7ED;border:1.5px solid #FED7AA;border-radius:8px;cursor:pointer;font-size:13px;color:#374151;transition:background .12s}
.cs-consent-check input[type="checkbox"]{display:inline-block!important;visibility:visible!important;opacity:1!important;width:17px;height:17px;accent-color:#F97316;flex-shrink:0;cursor:pointer;-webkit-appearance:checkbox;appearance:checkbox;position:static}
.cs-consent-footer{padding:0 18px 16px;display:flex;gap:8px}
.cs-consent-btn-cancel{flex:1;padding:10px;background:#F3F4F6;color:#4B5563;font-size:14px;font-weight:600;font-family:inherit;border:1px solid #E5E7EB;border-radius:8px;cursor:pointer;transition:all .12s}
.cs-consent-btn-cancel:hover{background:#E5E7EB}
.cs-consent-btn-ok{flex:1.5;padding:10px;background:#F97316;color:#fff;font-size:14px;font-weight:700;font-family:inherit;border:none;border-radius:8px;cursor:pointer;transition:all .15s}
.cs-consent-btn-ok:hover:not(:disabled){background:#EA6A0A;box-shadow:0 4px 14px rgba(249,115,22,.35)}
.cs-consent-btn-ok:disabled{background:#E5E7EB;color:#9CA3AF;cursor:not-allowed;box-shadow:none}
