@import"https://fonts.googleapis.com/icon?family=Material+Icons";:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background-color:#f0f0f0}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.circle-loader{display:inline-block;box-sizing:border-box}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.call-info{margin:12px auto 0;width:100%;max-width:300px}.contact-number{font-size:16px;font-weight:700;color:#000;margin-top:8px;padding:12px 24px;background:#fff;border-radius:12px;border:none;text-align:center;letter-spacing:1px}.dial-pad{display:grid;gap:16px;animation:slideDown .3s ease-out;margin:16px auto 0;justify-content:center;width:100%;max-width:300px;padding:20px;background:#fff;border-radius:16px;box-shadow:0 4px 16px #00000014;box-sizing:border-box}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.dial-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;justify-items:center}.dial-button{width:64px;height:64px;border:none;border-radius:50%;background:#f8fafc;color:#1e293b;font-size:20px;font-weight:500;cursor:pointer;transition:all .2s ease;border:2px solid #e2e8f0;box-shadow:0 2px 8px #0000000d}.dial-button:hover{background:#fff;border-color:#cbd5e1;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.dial-button:active{transform:translateY(0);box-shadow:0 2px 6px #00000014}.dial-button:disabled{opacity:.5;cursor:not-allowed}.delete-btn{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}.delete-btn:hover{background:#fee2e2}.call-btn{background:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0;font-size:15px}.call-btn:hover{background:#dcfce7}.control-icons{display:flex;gap:12px;align-items:center;justify-content:center;width:100%;flex-wrap:wrap;margin:24px auto 0;max-width:300px;position:relative;transition:margin .3s ease}.control-icons-no-dialpad{margin:350px auto 0!important}.phone-number{font-size:16px;font-weight:300;letter-spacing:.5px;min-height:20px;display:flex;align-items:center;justify-content:center}.keypad-toggle,.control-icon{width:44px;height:44px;border:none;border-radius:50%;background:#f8fafc;color:#475569;cursor:pointer;transition:all .2s ease;border:2px solid #e2e8f0;display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:18px;line-height:1;box-shadow:0 2px 8px #0000000d}.dialpad-icon .material-icons,.control-icon .material-icons{font-size:18px;color:inherit}.keypad-toggle:hover,.control-icon:hover{background:#fff;color:#1e293b;border-color:#cbd5e1;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.keypad-toggle:active,.control-icon:active{transform:translateY(0);box-shadow:0 2px 6px #00000014}.control-icon.active{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}.control-icon.active{color:#dc2626}.control-icon.call-end{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:2px solid #ef4444;box-shadow:0 4px 16px #ef44444d}.control-icon.call-end:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);transform:translateY(-2px);box-shadow:0 6px 20px #ef444466}.control-button .material-icons{font-size:20px;color:inherit}.mbottomzero{margin-bottom:0}.outgoincalloptext{font-size:12px;font-weight:500;color:inherit;margin:0;line-height:1}.calling-indicator{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:80px;margin:10px 0}.pulse-ring{position:absolute;width:60px;height:60px;border:2px solid rgba(255,255,255,.3);border-radius:50%;animation:pulse 2s infinite}.pulse-ring:nth-child(2){animation-delay:.5s}.pulse-ring:nth-child(3){animation-delay:1s}@keyframes pulse{0%{transform:scale(.8);opacity:1}to{transform:scale(2);opacity:0}}.calling-controls,.call-controls{display:flex;justify-content:center;align-items:center;gap:20px;margin:20px auto 0;width:100%;flex-wrap:wrap}.control-button{width:60px;height:60px;border:none;border-radius:50%;background:#f1f5f9;color:#334155;font-size:20px;cursor:pointer;transition:all .3s ease;border:1px solid #e2e8f0}.control-button:hover{background:#e2e8f0;transform:scale(1.1)}.control-button.active{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}.control-button.end-call{background:#fef2f2;color:#dc2626;border:1px solid #fecaca;font-size:18px}.control-button.end-call:hover{background:#fee2e2}.incoming-call-info{text-align:center;margin-top:10px}.incoming-call-title{font-size:18px;font-weight:600;color:#10b981;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.incoming-caller-number{font-size:28px;font-weight:700;color:#1e293b;letter-spacing:1.5px}.incoming-call-duration{font-size:18px;font-weight:600;color:#10b981;margin-top:8px;letter-spacing:1px}.test-controls{margin-top:10px}.test-incoming-btn{padding:8px 16px;background:#3b82f6;color:#fff;border:none;border-radius:6px;font-size:14px;cursor:pointer;transition:all .3s ease}.test-incoming-btn:hover{background:#2563eb;transform:translateY(-1px)}.incoming-call-display{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:20px 0}.incoming-call-avatar{width:140px;height:140px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#2563eb);display:flex;align-items:center;justify-content:center;margin-bottom:20px;box-shadow:0 12px 40px #3b82f666;position:relative;z-index:2}.incoming-call-avatar .material-icons{font-size:56px;color:#fff}.incoming-call-animation{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center}.incoming-pulse-ring{position:absolute;width:140px;height:140px;border:4px solid rgba(59,130,246,.5);border-radius:50%;animation:incomingPulse 2s infinite}.incoming-pulse-ring:nth-child(2){animation-delay:.5s}.incoming-pulse-ring:nth-child(3){animation-delay:1s}@keyframes incomingPulse{0%{transform:scale(.8);opacity:1}to{transform:scale(2.2);opacity:0}}.incoming-call-actions{display:flex;justify-content:center;align-items:center;gap:40px;margin:30px auto 0;width:100%}.decline-call-btn,.accept-call-btn{width:72px;height:72px;border:none;border-radius:50%;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px #00000026}.decline-call-btn{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.decline-call-btn:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);transform:translateY(-4px);box-shadow:0 8px 24px #ef444466}.accept-call-btn{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.accept-call-btn:hover{background:linear-gradient(135deg,#059669,#047857);transform:translateY(-4px);box-shadow:0 8px 24px #10b98166}.decline-call-btn .material-icons,.accept-call-btn .material-icons{font-size:28px}@media(max-width:480px){.calling-dialer{padding:16px}.phone-display{padding:20px;width:90%;min-width:280px;max-width:320px}.dial-button{width:56px;height:56px;font-size:18px}.phone-number{font-size:20px}.control-icon{width:48px;height:48px;min-width:48px;min-height:48px}.call-button-green{width:52px;height:52px}.phone-input{font-size:15px;padding:12px 14px 12px 110px!important;height:50px;letter-spacing:.4px}.intl-tel-input .selected-flag{width:95px!important;padding:0 8px 0 10px!important;gap:3px!important}.intl-tel-input .selected-flag .selected-dial-code{font-size:13px!important}.custom-phone-wrapper .PhoneInput{gap:6px!important}.custom-phone-wrapper .PhoneInputInput{font-size:15px!important;padding:12px 14px!important;height:44px!important}.custom-phone-wrapper .PhoneInputCountryIcon{width:22px!important;height:16px!important}.custom-phone-wrapper .PhoneInputCountryCode{font-size:13px!important}.custom-phone-wrapper .PhoneInputCountrySelectArrow{display:none!important}.PhoneInputCountrySelectDropdown{max-height:200px;overflow-y:scroll}.PhoneInputCountrySelectDropdown .PhoneInputCountryOption{padding:8px 12px!important;font-size:14px}.PhoneInputCountrySelectDropdown .PhoneInputCountryIcon{width:22px!important;height:16px!important}.PhoneInputCountrySelectDropdown .PhoneInputCountryName{font-size:14px}.PhoneInputCountrySelectDropdown .PhoneInputCountryCode{font-size:13px}.intl-tel-input .selected-flag .flag{width:22px;height:16px}.intl-tel-input .selected-flag:after{border-left:3px solid transparent;border-right:3px solid transparent;border-top:3px solid #9ca3af}.intl-tel-input .country-list{min-width:100%;max-height:280px}.intl-tel-input .country-list .country{padding:10px 12px}.intl-tel-input .country-list .country .flag{width:26px;height:18px}.intl-tel-input .country-list .country-name,.intl-tel-input .country-list .country .dial-code{font-size:15px}.incoming-call-avatar{width:120px;height:120px}.incoming-call-avatar .material-icons{font-size:48px}.incoming-pulse-ring{width:120px;height:120px}.decline-call-btn,.accept-call-btn{width:64px;height:64px}.decline-call-btn .material-icons,.accept-call-btn .material-icons{font-size:26px}.incoming-call-actions{gap:30px}.agent-status-section{padding:6px 16px}.phone-input-container{max-width:100%}.control-icons{gap:12px}.dial-pad{max-width:320px;padding:16px;gap:12px}.dial-row{gap:15px}}.calling-dialer{max-height:670px;min-height:670px;overflow:auto;margin:0;padding:24px 24px 32px;background:linear-gradient(135deg,#f8fafc,#e2e8f0);color:#1e293b;font-family:Inter,Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:20px;position:fixed;top:0;left:50%;transform:translate(-50%);z-index:1000;text-align:center;overflow-y:auto;box-sizing:border-box;scrollbar-width:thin;scrollbar-color:rgba(100,116,139,.5) rgba(226,232,240,.3)}.calling-dialer::-webkit-scrollbar{width:8px}.calling-dialer::-webkit-scrollbar-track{background:#e2e8f04d;border-radius:10px;margin:8px 0}.calling-dialer::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#64748b99,#47556999);border-radius:10px;border:2px solid rgba(248,250,252,.2);transition:background .3s ease}.calling-dialer::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#475569cc,#334155cc);border:2px solid rgba(248,250,252,.3)}.calling-dialer::-webkit-scrollbar-thumb:active{background:linear-gradient(180deg,#334155e6,#1e293be6)}.dialer-header{text-align:left;margin-bottom:0;display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:16px;width:100%;max-width:350px}.dialer-header h2{margin:0;font-size:24px;font-weight:300}.agent-status-section{display:flex;flex-direction:column;align-items:flex-start;gap:12px;background:#fff;padding:8px 20px;border-radius:16px;border:2px solid #e2e8f0;box-shadow:0 4px 12px #00000014;min-width:22px;position:relative;transition:all .3s ease}.agent-status-section.available{background:linear-gradient(135deg,#10b981,#059669);border-color:#10b981;box-shadow:0 4px 16px #10b9814d}.agent-status-section.unavailable{background:linear-gradient(135deg,#ef4444,#dc2626);border-color:#ef4444;box-shadow:0 4px 16px #ef44444d}.status-label{font-size:14px;font-weight:500;color:#374151;margin:0}.radio-group{display:flex;flex-direction:column;gap:6px}.radio-option{display:flex;align-items:center;gap:8px;cursor:pointer;padding:4px 0;min-width:319px;transition:all .2s ease}.radio-input{width:16px;height:16px;margin:0;cursor:pointer;accent-color:#3b82f6}.agent-status-section.available .radio-input{accent-color:#10b981}.agent-status-section.unavailable .radio-input{accent-color:#ef4444}.radio-label{font-size:14px;color:#edf0f4;font-weight:400;cursor:pointer;-webkit-user-select:none;user-select:none}.agent-status-section.available .radio-label{color:#fff}.radio-input:checked+.radio-label{color:#edf0f4;font-weight:500}.status-duration{font-size:15px;color:#edf0f4;font-weight:500;margin-left:auto;margin-top:4px;margin-right:0}.agent-status-section.available .status-duration{color:#fff}.dropdown-icon{width:25px;height:25px;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;color:#edf0f4;justify-content:center;margin-left:0;margin-top:4px;transition:all .2s ease}.dropdown-icon:hover{background:#f2eded0d;border-radius:4px}.dropdown-icon .material-icons{font-size:16px;color:#6b7280}.agent-status-section.available .dropdown-icon .material-icons{color:#fff}.dropdown-icon:hover .material-icons{color:#374151}.settings-icon{width:20px;height:20px;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-left:0;margin-top:4px;transition:all .2s ease}.settings-icon:hover{background:#0000000d;border-radius:4px}.settings-icon .material-icons{font-size:16px;color:#6b7280}.agent-status-section.available .settings-icon .material-icons{color:#fff}.settings-icon:hover .material-icons{color:#374151}.dialer-options{display:flex;flex-direction:column;gap:15px;margin-top:20px;width:100%;max-width:400px}.options-grid{display:grid;grid-template-columns:1fr 1fr 2fr;grid-template-rows:auto auto;gap:12px}.option-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 12px;border-radius:8px;background:#fff;font-size:14px;font-weight:500;color:#374151;width:100%;text-align:center;cursor:default;pointer-events:none}.option-btn.dialpad-option-btn{cursor:pointer;pointer-events:auto;transition:all .3s ease}.option-btn.dialpad-option-btn:hover{background:#f8fafc;border-color:#cbd5e1;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.option-btn .material-icons{font-size:24px;color:inherit}.icon-wrapper{position:relative;display:inline-flex;align-items:center;justify-content:center}.parked-btn .call-icon{font-size:24px;color:inherit}.parked-btn .cross-icon{position:absolute;font-size:14px;color:#ef4444;top:-4px;right:-6px;background:#fff;border-radius:50%;width:16px;height:16px;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px #0003}.talk-time-btn{grid-column:3}.dialpad-toggle-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;cursor:pointer;transition:all .3s ease;font-size:14px;font-weight:500;color:#374151;width:100%}.dialpad-toggle-btn:hover{background:#f8fafc;border-color:#cbd5e1;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.dialpad-toggle-btn .material-icons{font-size:20px;color:inherit}.status-dropdown-menu{position:absolute;top:100%;left:0;background:#fff;border:2px solid #e2e8f0;border-radius:12px;box-shadow:0 8px 24px #0000001f;z-index:1000;width:100%;margin-top:8px;animation:slideDown .2s ease-out;overflow:hidden}.dropdown-section{padding:4px 0;border-bottom:1px solid #f1f5f9}.dropdown-section:last-child{border-bottom:none}.section-title{font-size:12px;font-weight:700;color:#1f2937;padding:6px 16px 4px;text-transform:none;letter-spacing:0;border-bottom:1px solid #e5e7eb;margin-bottom:2px}.dropdown-option{display:flex;align-items:center;gap:12px;padding:12px 20px 12px 36px;cursor:pointer;transition:all .2s ease;font-size:14px;color:#475569;font-weight:500}.dropdown-option:hover{background-color:#f1f5f9;padding-left:40px}.status-indicator{width:10px;height:10px;border-radius:50%;flex-shrink:0;box-shadow:0 0 0 3px #0000000d}.status-indicator.available{background-color:#10b981;box-shadow:0 0 0 3px #10b98133}.status-indicator.unavailable{background-color:#ef4444;box-shadow:0 0 0 3px #ef444433}.call-info{margin-top:0;display:flex;flex-direction:column;align-items:center;width:100%}.call-duration{font-size:18px;font-weight:700;color:#4ade80}.call-duration-display{font-size:16px;font-weight:700;color:#fff;margin-top:8px;padding:12px 24px;background:linear-gradient(135deg,#10b981,#059669);border-radius:12px;border:none;text-align:center;box-shadow:0 4px 12px #10b9814d;letter-spacing:1px}.call-status{font-size:14px;opacity:.8}.number-input-section{display:flex;justify-content:center;width:100%;max-width:300px;margin:20px auto 0}.phone-input-container{display:flex;justify-content:center;align-items:stretch;gap:0;width:100%;max-width:100%;position:relative}.custom-phone-wrapper{width:100%;display:flex;align-items:center;gap:0}.custom-phone-wrapper .PhoneInput{display:flex!important;align-items:center!important;width:100%!important;gap:8px!important;flex-direction:row!important;flex-wrap:nowrap!important}.custom-phone-wrapper .PhoneInput>*{margin:0!important}.phone-input-container .intl-tel-input{width:100%;display:block;position:relative}.custom-phone-wrapper .PhoneInputCountry{padding:0 10px 0 12px!important;background:#fff!important;border:2px solid #e2e8f0!important;border-radius:10px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:6px!important;min-width:auto!important;max-width:auto!important;cursor:pointer!important;transition:all .2s ease!important;position:relative!important;height:48px!important;box-sizing:border-box!important;flex-shrink:0!important;margin:0!important}.custom-phone-wrapper .PhoneInputCountry:hover{background:#f8fafc!important;border-color:#cbd5e1!important}.custom-phone-wrapper .PhoneInputCountryIcon{width:24px!important;height:18px!important;border-radius:2px!important;overflow:hidden!important;display:block!important;flex-shrink:0!important;box-shadow:0 1px 2px #0000001a!important}.custom-phone-wrapper .PhoneInputCountryIcon img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}.custom-phone-wrapper .PhoneInputCountryCode{font-size:14px!important;font-weight:600!important;color:#1f2937!important;margin:0!important;line-height:1!important;flex-shrink:0!important}.custom-phone-wrapper .PhoneInputCountrySelectArrow{display:none!important}.custom-phone-wrapper .PhoneInputCountry:hover .PhoneInputCountrySelectArrow{border-top-color:#374151!important}.custom-phone-wrapper .PhoneInputCountrySelect{position:absolute!important;top:0!important;left:0!important;height:100%!important;width:100px!important;z-index:1!important;border:0!important;opacity:0!important;cursor:pointer!important}.custom-phone-wrapper .PhoneInputCountrySelect:focus~.PhoneInputCountrySelectArrow{border-top-color:#3b82f6!important;transform:rotate(180deg)!important}.custom-phone-wrapper .PhoneInputInput{padding:14px 16px!important;border:2px solid #e2e8f0!important;border-radius:10px!important;background:#fff!important;font-size:16px!important;color:#1f2937!important;transition:all .2s ease!important;flex:1!important;font-family:Inter,Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif!important;text-align:left!important;font-weight:400!important;height:48px!important;box-sizing:border-box!important;letter-spacing:.5px!important;min-width:0!important}.custom-phone-wrapper .PhoneInputInput:hover{border-color:#cbd5e1!important}.custom-phone-wrapper .PhoneInputInput:focus{outline:none!important;border-color:#3b82f6!important;background:#fff!important;box-shadow:0 0 0 3px #3b82f61a!important}.custom-phone-wrapper .PhoneInputInput:disabled{background:#f9fafb!important;color:#9ca3af!important;cursor:not-allowed!important;border-color:#e5e7eb!important}.custom-phone-wrapper .PhoneInputInput::placeholder{color:#9ca3af!important;font-weight:400!important;font-size:16px!important;letter-spacing:.3px!important}.PhoneInputCountrySelect{font-family:Inter,Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif!important;font-size:15px!important;color:#1f2937!important;background:#fff!important;border:2px solid #e5e7eb!important;border-radius:8px!important;padding:8px!important;max-height:200px!important;overflow-y:scroll!important}.PhoneInputCountrySelect option{padding:10px 12px!important;font-size:15px!important;color:#1f2937!important;background:#fff!important;font-family:Inter,Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif!important;line-height:1.6!important}.PhoneInputCountrySelect option:hover,.PhoneInputCountrySelect option:focus{background:#f9fafb!important;color:#1f2937!important}.PhoneInputCountrySelect option:checked{background:#eff6ff!important;color:#1e40af!important;font-weight:600!important}.PhoneInputCountrySelectDropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:2px solid #e5e7eb;border-radius:12px;box-shadow:0 10px 30px #0000001a;max-height:200px;overflow-y:scroll;margin-top:4px;z-index:1000;padding:8px}.PhoneInputCountrySelectDropdown .PhoneInputCountryOption{display:flex!important;align-items:center!important;padding:10px 14px!important;cursor:pointer;border-radius:8px;transition:all .15s ease;font-size:15px;color:#1f2937;gap:10px!important}.PhoneInputCountrySelectDropdown .PhoneInputCountryOption:hover{background:#f9fafb}.PhoneInputCountrySelectDropdown .PhoneInputCountryOption--selected{background:#eff6ff;color:#1e40af;font-weight:500}.PhoneInputCountrySelectDropdown .PhoneInputCountryIcon{display:block!important;width:24px!important;height:18px!important;border-radius:2px!important;overflow:hidden!important;flex-shrink:0!important;box-shadow:0 1px 2px #0000001a!important}.PhoneInputCountrySelectDropdown .PhoneInputCountryIcon img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}.PhoneInputCountrySelectDropdown .PhoneInputCountryName{flex:1;font-size:15px;color:#1f2937}.PhoneInputCountrySelectDropdown .PhoneInputCountryCode{font-size:14px;font-weight:600;color:#6b7280;margin-left:auto}.phone-input{padding:14px 16px 14px 123px!important;border:2px solid #e5e7eb!important;border-radius:12px!important;background:#fff!important;font-size:16px!important;color:#1f2937!important;transition:all .2s ease!important;width:100%!important;font-family:Inter,Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif!important;text-align:left!important;font-weight:400!important;height:52px!important;box-sizing:border-box!important;letter-spacing:.5px!important}.call-button-green{width:48px;height:48px;border:none;border-radius:50%;background:linear-gradient(135deg,#10b981,#059669);color:#fff;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 16px #10b9814d}.call-button-green:hover:not(:disabled){background:linear-gradient(135deg,#059669,#047857);transform:translateY(-2px);box-shadow:0 6px 20px #10b98166}.call-button-green:disabled{background:#9ca3af;cursor:not-allowed;transform:none;box-shadow:none;opacity:.6}.call-button-green .material-icons{font-size:20px;color:#fff}.phone-input:hover{border-color:#d1d5db}.phone-input:focus{outline:none!important;border-color:#3b82f6!important;background:#fff;box-shadow:0 0 0 3px #3b82f61a}.phone-input:disabled{background:#f9fafb!important;color:#9ca3af;cursor:not-allowed;border-color:#e5e7eb!important}.intl-tel-input:has(.phone-input:disabled) .selected-flag{background:transparent;color:#9ca3af;cursor:not-allowed;pointer-events:none}.phone-input::placeholder{color:#9ca3af;font-weight:400;font-size:16px;letter-spacing:.3px}.dtmf-input-section{display:flex;justify-content:center;width:100%;max-width:300px;margin:0 auto;padding:0 10px;box-sizing:border-box}.dtmf-input-container{display:flex;align-items:center;gap:8px;width:100%;position:relative}.dtmf-input{flex:1;padding:16px 40px 16px 16px!important;border:2px solid #10b981!important;border-radius:12px!important;background:linear-gradient(135deg,#fff,#f0fdf4)!important;font-size:20px!important;font-weight:700;color:#1f2937;text-align:center;letter-spacing:3px;transition:all .2s ease;box-shadow:0 4px 12px #10b98126,0 2px 4px #0000000d;width:100%;box-sizing:border-box;min-height:54px}.dtmf-input:focus{outline:none!important;border-color:#059669!important;box-shadow:0 0 0 4px #10b98133,0 4px 16px #10b98140;background:#fff!important}.dtmf-input::placeholder{color:#10b981;font-weight:500;font-size:15px;letter-spacing:1px;opacity:.6}.dtmf-backspace-button{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:#6b7280;border:none;border-radius:8px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;padding:0;box-shadow:0 2px 4px #0000001a}.dtmf-backspace-button:hover{background:#4b5563;transform:translateY(-50%) scale(1.05);box-shadow:0 4px 8px #00000026}.dtmf-backspace-button:active{transform:translateY(-50%) scale(.95)}.dtmf-backspace-button .material-icons{font-size:20px;color:#fff}.dial-delete{background:#ef4444!important;grid-column:2 / 3;visibility:hidden}.dial-delete:hover:not(:disabled){background:#dc2626!important;box-shadow:0 4px 12px #ef44444d}.dial-delete .material-icons{font-size:24px;color:#fff}.intl-tel-input{width:100%;position:relative;display:block}.intl-tel-input .country-list{position:absolute!important;z-index:1001!important;list-style:none;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 10px 30px #0000001a,0 4px 8px #0000000d;max-height:320px;overflow-y:auto;margin-top:8px;padding:8px;width:100%!important;min-width:300px;left:0!important;top:100%!important;animation:dropdownSlide .2s ease-out}.intl-tel-input .hide,.intl-tel-input .iti-mobile,.intl-tel-input .iti__hide,.intl-tel-input .iti__a11y-text,.intl-tel-input .selected-flag div[class*=arrow],.intl-tel-input .selected-flag [class*=iti__arrow],.intl-tel-input .selected-flag span[class*=arrow]{display:none!important}.intl-tel-input .selected-flag>*:not(.flag):not(.iti-flag):not([class*=flag]){display:none!important}.intl-tel-input .country-list.iti__country-list{display:block!important}.intl-tel-input.iti-container:not(.iti-container--open) .country-list{display:none!important}@keyframes dropdownSlide{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.intl-tel-input .country-list{scrollbar-width:thin;scrollbar-color:rgba(100,116,139,.5) rgba(243,244,246,.5)}.intl-tel-input .country-list::-webkit-scrollbar{width:8px}.intl-tel-input .country-list::-webkit-scrollbar-track{background:#f3f4f680;border-radius:10px;margin:4px 0}.intl-tel-input .country-list::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#64748b99,#47556999);border-radius:10px;border:2px solid rgba(255,255,255,.3);transition:background .3s ease}.intl-tel-input .country-list::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#475569cc,#334155cc);border:2px solid rgba(255,255,255,.4)}.intl-tel-input .country-list::-webkit-scrollbar-thumb:active{background:linear-gradient(180deg,#334155e6,#1e293be6)}.intl-tel-input .country-list .search{position:sticky;top:0;background:#fff;padding:8px;margin:-8px -8px 8px;border-bottom:1px solid #f3f4f6;z-index:2}.intl-tel-input .country-list .search-box{width:100%;padding:12px 16px 12px 44px;border:1px solid #e5e7eb;border-radius:8px;font-size:16px;color:#374151;background:#fff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="%239ca3af" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"/><path d="m21 21-4.35-4.35"/></svg>') no-repeat 14px center;font-family:inherit;transition:all .2s ease}.intl-tel-input .country-list .search-box:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.intl-tel-input .country-list .country:hover{background:#f9fafb}.intl-tel-input .country-list .country.highlight{background:#eff6ff;color:#1e40af}.intl-tel-input .selected-flag{position:absolute!important;top:2px!important;bottom:2px!important;left:2px!important;transform:none!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;padding:0 10px 0 14px!important;background:transparent!important;border:none!important;border-right:1px solid #e5e7eb!important;border-radius:10px 0 0 10px!important;width:105px!important;height:auto!important;cursor:pointer!important;z-index:1!important;transition:all .2s ease!important;gap:4px!important}.intl-tel-input .selected-flag:after{content:"";border-left:3px solid transparent;border-right:3px solid transparent;border-top:4px solid #9ca3af;width:0;height:0;margin-left:auto;transition:all .2s ease}.intl-tel-input .selected-flag:hover{background:#f9fafb!important}.intl-tel-input .selected-flag .flag{display:inline-block!important;margin:0!important;width:26px!important;height:19px!important;border-radius:3px!important;object-fit:cover!important;flex-shrink:0!important}.intl-tel-input .selected-flag .iti-flag{display:inline-block!important;margin:0!important;flex-shrink:0!important}.intl-tel-input .selected-flag .arrow,.intl-tel-input .selected-flag .iti__arrow{display:none!important}.intl-tel-input .selected-flag:hover:after{border-top-color:#6b7280}.intl-tel-input.iti-container--open .selected-flag:after{transform:rotate(180deg);border-top-color:#3b82f6}.intl-tel-input .selected-flag .selected-dial-code{display:inline-block!important;font-size:14px!important;font-weight:600!important;color:#374151!important;margin-left:4px!important;padding:0!important}.intl-tel-input .selected-flag:focus{outline:none!important}.intl-tel-input .selected-flag:active{background:#f3f4f6!important}.intl-tel-input.iti-container--open .selected-flag{background:#eff6ff!important;border-right-color:#3b82f6!important}.intl-tel-input .country-list .country{display:flex;align-items:center;padding:12px 14px;border-radius:8px;cursor:pointer;transition:all .15s ease;gap:12px;margin-bottom:2px}.intl-tel-input .country-list .country .flag{display:inline-block!important;width:28px;height:20px;border-radius:3px;object-fit:cover;flex-shrink:0}.intl-tel-input .country-list .country .iti-flag{display:inline-block!important;flex-shrink:0}.intl-tel-input .country-list .country-name{display:inline-block!important;flex:1;font-size:16px;color:#111827;font-weight:500}.intl-tel-input .country-list .country .dial-code{display:inline-block!important;margin-left:auto;font-weight:600;color:#6b7280;font-size:16px;flex-shrink:0}.intl-tel-input .country-list .country.highlight .country-name,.intl-tel-input .country-list .country.highlight .dial-code{color:#1e40af}.call-actions{display:flex;justify-content:center;align-items:center;margin:20px auto 0;width:100%}.call-button{padding:15px 30px;border:none;border-radius:25px;background:#10b981;color:#fff;font-size:18px;font-weight:600;cursor:pointer;transition:all .3s ease;min-width:120px}.call-button:hover:not(:disabled){background:#059669;transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.call-button:disabled{background:#9ca3af;cursor:not-allowed;transform:none;box-shadow:none}.dialpad-top-toggle-btn{display:flex;align-items:center;justify-content:center;gap:8px;margin:15px auto 10px;padding:10px 20px;background:#eff6ff;color:#2563eb;border:1px solid #bfdbfe;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease;width:fit-content;box-shadow:0 2px 4px #0000001a}.dialpad-top-toggle-btn:hover{background:#dbeafe;border-color:#93c5fd;transform:translateY(-1px);box-shadow:0 4px 6px #00000026}.dialpad-top-toggle-btn .material-icons{font-size:20px}.intl-tel-input .selected-flag>*:not(.flag):not(.iti-flag):not([class*=flag]){display:inline-block!important}.intl-tel-input .selected-flag:after{display:none!important}:root{--PhoneInput-color--focus: #03b2cb;--PhoneInputInternationalIconPhone-opacity: .8;--PhoneInputInternationalIconGlobe-opacity: .65;--PhoneInputCountrySelect-marginRight: .35em;--PhoneInputCountrySelectArrow-width: .3em;--PhoneInputCountrySelectArrow-marginLeft: var(--PhoneInputCountrySelect-marginRight);--PhoneInputCountrySelectArrow-borderWidth: 1px;--PhoneInputCountrySelectArrow-opacity: .45;--PhoneInputCountrySelectArrow-color: currentColor;--PhoneInputCountrySelectArrow-color--focus: var(--PhoneInput-color--focus);--PhoneInputCountrySelectArrow-transform: rotate(45deg);--PhoneInputCountryFlag-aspectRatio: 1.5;--PhoneInputCountryFlag-height: 1em;--PhoneInputCountryFlag-borderWidth: 1px;--PhoneInputCountryFlag-borderColor: rgba(0,0,0,.5);--PhoneInputCountryFlag-borderColor--focus: var(--PhoneInput-color--focus);--PhoneInputCountryFlag-backgroundColor--loading: rgba(0,0,0,.1)}.PhoneInput{display:flex;align-items:center}.PhoneInputInput{flex:1;min-width:0}.PhoneInputCountryIcon{width:calc(var(--PhoneInputCountryFlag-height) * var(--PhoneInputCountryFlag-aspectRatio));height:var(--PhoneInputCountryFlag-height)}.PhoneInputCountryIcon--square{width:var(--PhoneInputCountryFlag-height)}.PhoneInputCountryIcon--border{background-color:var(--PhoneInputCountryFlag-backgroundColor--loading);box-shadow:0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor),inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor)}.PhoneInputCountryIconImg{display:block;width:100%;height:100%}.PhoneInputInternationalIconPhone{opacity:var(--PhoneInputInternationalIconPhone-opacity)}.PhoneInputInternationalIconGlobe{opacity:var(--PhoneInputInternationalIconGlobe-opacity)}.PhoneInputCountry{position:relative;align-self:stretch;display:flex;align-items:center;margin-right:var(--PhoneInputCountrySelect-marginRight)}.PhoneInputCountrySelect{position:absolute;top:0;left:0;height:100%;width:100%;z-index:1;border:0;opacity:0;cursor:pointer}.PhoneInputCountrySelect[disabled],.PhoneInputCountrySelect[readonly]{cursor:default}.PhoneInputCountrySelectArrow{display:block;content:"";width:var(--PhoneInputCountrySelectArrow-width);height:var(--PhoneInputCountrySelectArrow-width);margin-left:var(--PhoneInputCountrySelectArrow-marginLeft);border-style:solid;border-color:var(--PhoneInputCountrySelectArrow-color);border-top-width:0;border-bottom-width:var(--PhoneInputCountrySelectArrow-borderWidth);border-left-width:0;border-right-width:var(--PhoneInputCountrySelectArrow-borderWidth);transform:var(--PhoneInputCountrySelectArrow-transform);opacity:var(--PhoneInputCountrySelectArrow-opacity)}.PhoneInputCountrySelect:focus+.PhoneInputCountryIcon+.PhoneInputCountrySelectArrow{opacity:1;color:var(--PhoneInputCountrySelectArrow-color--focus)}.PhoneInputCountrySelect:focus+.PhoneInputCountryIcon--border{box-shadow:0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus),inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus)}.PhoneInputCountrySelect:focus+.PhoneInputCountryIcon .PhoneInputInternationalIconGlobe{opacity:1;color:var(--PhoneInputCountrySelectArrow-color--focus)}.modal-overlay{position:fixed;inset:0;background:#000000d9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.incoming-call-modal{background:linear-gradient(135deg,#fff,#f8fafc);border-radius:32px;padding:16px;max-width:350px;width:90%;text-align:center;box-shadow:0 25px 50px -12px #00000040,0 0 0 1px #0000000d;animation:slideUpBounce .5s cubic-bezier(.34,1.56,.64,1);position:relative;overflow:hidden}@keyframes slideUpBounce{0%{opacity:0;transform:translateY(100px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-background-glow{position:absolute;inset:-50%;background:radial-gradient(circle,rgba(59,130,246,.1) 0%,transparent 70%);animation:rotateGlow 10s linear infinite;pointer-events:none}@keyframes rotateGlow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.modal-content{display:flex;flex-direction:column;align-items:center;gap:22px;position:relative;z-index:1}.call-status-label{display:inline-flex;align-items:center;gap:8px;padding:8px 20px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border-radius:24px;font-size:14px;font-weight:600;letter-spacing:.5px;box-shadow:0 4px 12px #3b82f64d;animation:pulse-label 2s ease-in-out infinite}@keyframes pulse-label{0%,to{box-shadow:0 4px 12px #3b82f64d}50%{box-shadow:0 4px 20px #3b82f680}}.status-indicator{width:8px;height:8px;background:#fff;border-radius:50%;animation:blink 1.5s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.caller-info{display:flex;flex-direction:column;align-items:center;gap:24px;width:100%}.caller-avatar-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.caller-avatar{width:140px;height:140px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#8b5cf6);display:flex;align-items:center;justify-content:center;box-shadow:0 20px 40px #3b82f64d,0 0 0 8px #3b82f61a;position:relative;z-index:2;animation:avatarFloat 3s ease-in-out infinite}@keyframes avatarFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.avatar-initials{font-size:48px;font-weight:700;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.2);letter-spacing:2px}.pulse-rings{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.pulse-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:140px;height:140px;border:3px solid rgba(59,130,246,.6);border-radius:50%;animation:pulse-expand 2s cubic-bezier(.4,0,.6,1) infinite}.pulse-ring:nth-child(2){animation-delay:.6s}.pulse-ring:nth-child(3){animation-delay:1.2s}@keyframes pulse-expand{0%{transform:translate(-50%,-50%) scale(.9);opacity:1}to{transform:translate(-50%,-50%) scale(2);opacity:0}}.caller-details{text-align:center;width:100%}.caller-name{font-size:28px;font-weight:700;color:#1f2937;margin-bottom:8px;letter-spacing:-.5px;line-height:1.2}.caller-number{font-size:28px;color:#000;font-weight:600;letter-spacing:1px}.modal-actions{width:100%;margin-top:8px}.action-buttons{display:flex;justify-content:center;align-items:center;gap:24px}.action-single{display:flex;justify-content:center}.action-btn{display:flex;flex-direction:column;align-items:center;gap:12px;background:none;border:none;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);padding:0}.action-btn:active{transform:scale(.95)}.btn-icon-wrapper{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.btn-icon-wrapper:before{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;border-radius:50%;transform:translate(-50%,-50%) scale(0);transition:transform .3s cubic-bezier(.4,0,.2,1)}.action-btn:hover .btn-icon-wrapper:before{transform:translate(-50%,-50%) scale(1.5)}.reject-btn .reject-icon{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 8px 24px #ef444466,0 0 #ef444400;animation:pulse-red 2s ease-in-out infinite}@keyframes pulse-red{0%,to{box-shadow:0 8px 24px #ef444466,0 0 #ef444400}50%{box-shadow:0 8px 32px #ef444480,0 0 0 8px #ef44441a}}.IconRejectButton{height:72px;width:72px;border-radius:50%;background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 8px 24px #ef444466,0 0 #ef444400;animation:pulse-red 2s ease-in-out infinite}.reject-btn:hover .reject-icon{background:linear-gradient(135deg,#dc2626,#b91c1c);transform:scale(1.1);box-shadow:0 12px 32px #ef444480}.reject-icon:before{background:#fff3}.answer-btn .answer-icon{background:linear-gradient(135deg,#10b981,#059669);box-shadow:0 8px 24px #10b98166,0 0 #10b98100;animation:pulse-green 2s ease-in-out infinite}@keyframes pulse-green{0%,to{box-shadow:0 8px 24px #10b98166,0 0 #10b98100}50%{box-shadow:0 8px 32px #10b98180,0 0 0 8px #10b9811a}}.answer-btn:hover .answer-icon{background:linear-gradient(135deg,#059669,#047857);transform:scale(1.1);box-shadow:0 12px 32px #10b98180}.answer-icon:before{background:#fff3}.btn-icon-wrapper .material-icons{font-size:32px;color:#fff;position:relative;z-index:1}.btn-label{font-size:15px;font-weight:600;color:#4b5563;letter-spacing:.3px;transition:color .3s ease}.reject-btn:hover .btn-label{color:#ef4444}.answer-btn:hover .btn-label{color:#10b981}.action-single .btn-icon-wrapper{width:80px;height:80px}.action-single .btn-icon-wrapper .material-icons{font-size:36px}@media(max-width:480px){.incoming-call-modal{padding:40px 28px;border-radius:28px;max-width:360px}.caller-avatar{width:120px;height:120px}.avatar-initials{font-size:40px}.pulse-ring{width:120px;height:120px}.caller-name{font-size:24px}.caller-number{font-size:16px}.btn-icon-wrapper{width:64px;height:64px}.btn-icon-wrapper .material-icons{font-size:28px}.action-buttons{gap:20px}.btn-label{font-size:14px}.action-single .btn-icon-wrapper{width:72px;height:72px}.action-single .btn-icon-wrapper .material-icons{font-size:32px}}@media(max-width:360px){.incoming-call-modal{padding:32px 20px}.modal-content{gap:24px}.caller-info{gap:20px}}