/* === SimplyIN Hyva Checkout - Email Integration === */

/* Banner Styles */
.sly-banner{display:flex;align-items:center;gap:8px;margin-bottom:20px}
.sly-banner-line{flex:1;height:4px;background:linear-gradient(90deg,#0ad0cc 0%,#2a5ff2 50%,#b922f9 100%);border-radius:2px}
.sly-banner-content{display:flex;align-items:center;gap:8px;white-space:nowrap;padding:0 8px}
.sly-banner-logo{width:20px;height:20px}
.sly-banner-text{font-size:14px;font-weight:600;color:#000}

/* Badge Styles */
.sly-badge-container{margin:15px 0;display:none}
.sly-badge-container.visible{display:block}
.sly-badge{width: max-content;display:inline-flex;padding:10px 14px;border:1px solid #e0e0e0;border-radius:10px;background:#fff;gap:12px;align-items:center;cursor:pointer;transition:all .2s}
.sly-badge:hover{border-color:#2a5ff2;box-shadow:0 2px 8px rgba(42,95,242,.15)}
.sly-badge-icon{position:relative;flex-shrink:0}
.sly-badge-icon img{width:32px;height:32px}
.sly-badge-icon .sly-check{position:absolute;bottom:-2px;right:-2px}
.sly-badge-info{display:flex;flex-direction:column;font-size:13px;line-height:1.4}
.sly-badge-title{font-weight:600;color:#333}
.sly-badge-subtitle{color:#666;font-size:12px}
.sly-badge-action{color:#2d40f6;font-weight:600;display:inline-flex;align-items:center;gap:4px;font-size:13px;margin-top:2px}

/* User Info (Data Completed) Styles - Matching Luma Design */
.sly-user-info{display:none;margin:10px 0}
.sly-user-info.visible{display:block}
.sly-user-badge{width: max-content;display:inline-flex;align-items:center;padding:6px 12px;border:1px solid #e0e0e0;border-radius:8px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.05);gap:10px;cursor:pointer;transition:all .2s}
.sly-user-badge:hover{border-color:#2a5ff2;box-shadow:0 2px 8px rgba(42,95,242,.15)}
.sly-user-badge-icon{position:relative;flex-shrink:0}
.sly-user-badge-icon img{width:28px;height:28px}
.sly-user-badge-icon .sly-check{position:absolute;bottom:-2px;right:-2px}
.sly-user-badge-info{display:flex;flex-direction:column;font-size:12px;line-height:1.3}
.sly-user-badge-title{font-weight:600;color:#333;display:flex;align-items:center;gap:4px}
.sly-user-badge-title .sly-green-check{width:14px;height:14px;background:#28a745;border-radius:50%;display:flex;align-items:center;justify-content:center}
.sly-user-badge-title .sly-green-check svg{width:8px;height:8px}
.sly-user-badge-action{color:#2d40f6;font-weight:600;font-size:13px;text-decoration:none;display:inline-flex;align-items:center;gap:2px}
.sly-user-badge-action:hover{text-decoration:underline}

/* Loader */
.sly-loader{display:none;align-items:center;gap:8px;margin:10px 0;font-size:14px;color:#666}
.sly-loader.visible{display:inline-flex}
.sly-loader-spin{width:16px;height:16px;border:2px solid #e5e5e5;border-top-color:#2a5ff2;border-radius:50%;animation:slyspin 1s linear infinite}
@keyframes slyspin{to{transform:rotate(360deg)}}

/* Modal Overlay - Matching Luma simplyin-modal.css */
.sly-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);opacity:0;visibility:hidden;transition:all .3s ease}
.sly-overlay.active{opacity:1;visibility:visible;z-index:999999}
.sly-modal{background:#fff;border-radius:24px;max-width:522px;width:calc(100% - 32px);max-height:90vh;box-shadow:0 20px 40px rgba(0,0,0,.2);overflow:hidden;transform:scale(0.9);transition:transform .3s ease;display:flex;flex-direction:column;font-family:"Inter Tight",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.sly-overlay.active .sly-modal{transform:scale(1)}
.sly-modal-header{display:flex;justify-content:space-between;align-items:center;padding:39px 60px 10px 60px;margin-bottom:18px;flex-shrink:0}
.sly-modal-header img{width:40px;height:40px}
.sly-modal-header h3{flex:1;font-size:24px;font-weight:600;margin:0;text-align:center;color:#1f1f1f;line-height:1}
.sly-modal-close{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:24px;cursor:pointer;border-radius:6px;color:#333;background:none;border:1px solid #e5e5e5;transition:background .2s;line-height:1}
.sly-modal-close:hover{background:#f5f5f5}
.sly-modal-body{padding:0 60px 20px;overflow-y:auto;flex:1;scrollbar-width:thin;scrollbar-color:#c1c1c1 #f1f1f1}
.sly-modal-caption{text-align:center;font-size:17px;font-weight:600;color:#606060;margin:0 auto 32px;line-height:1.24}
.sly-modal-caption strong{display:block;color:#1f1f1f;margin-top:4px}
@media screen and (max-width:768px){.sly-modal-header{padding:39px 20px 10px 20px}.sly-modal-header h3{font-size:20px}.sly-modal-body{padding:0 20px 20px}}

/* OTP Input Styles - Matching Luma */
.sly-otp-wrap{display:flex;justify-content:center;gap:10px;margin:24px 0}
.sly-otp-input{width:55px;height:87px;text-align:center;font-size:32px;font-weight:600;border:1px solid #dbdbdb;border-radius:8px;outline:none;transition:all .2s;color:#1f1f1f;background:#fff}
.sly-otp-input:focus{border-color:#000}
.sly-otp-input.filled{border-color:#33cc40;background:#f0fdf4}
.sly-otp-input.error{border-color:#e52424;background:#fef2f2}
.sly-error{color:#e52424;font-size:14px;text-align:center;margin-bottom:12px;display:none}
.sly-modal-footer{padding:0 16px 16px;text-align:center;flex-shrink:0}
.sly-timer{font-size:14px;color:#e22626;font-weight:500}
.sly-timer span{font-weight:700;margin-left:5px}
.sly-resend{font-size:14px;color:#666;display:none}
.sly-resend-title{margin-bottom:28px;color:#1f1f1f;font-size:17px;font-weight:600;line-height:1}
.sly-btn{cursor:pointer;font-size:16px;font-weight:600;color:#606060;background-color:transparent;border:1px solid #e7e7e7;border-radius:160px;padding:20px;width:100%;max-width:187px;height:56px;line-height:1;transition:all .2s}
.sly-btn-secondary{background:#fff;color:#606060;border:1px solid #e7e7e7}
.sly-btn:hover{opacity:.9}
.sly-divider{height:1px;background:#f0f0f0;margin:20px 0;width:100%}
.sly-apps{display:flex;flex-direction:column;align-items:center;gap:15px;padding:0 60px 20px;flex-shrink:0}
.sly-apps-text{font-size:14px;color:#333;display:flex;align-items:center;gap:5px}
.sly-apps-text img{height:16px}
.sly-apps-buttons{display:flex;gap:15px}
.sly-apps-buttons a img{height:35px;width:auto}
@media screen and (max-width:768px){.sly-otp-input{width:45px;height:70px;font-size:24px}.sly-apps{padding:0 20px 20px}}

/* Account Details Modal Styles */
.sly-account-details{padding:0 36px}
.sly-section-title{font-size:17px;font-weight:700;color:#1f1f1f;margin-bottom:16px;text-align:left}
.sly-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.sly-section-header .sly-section-title{margin-bottom:0}
.sly-addresses{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}
.sly-address-item{position:relative;border-radius:16px;padding:24px;border:1px solid #e7e7e7;cursor:pointer;display:flex;gap:12px;align-items:flex-start;transition:border-color .2s}
.sly-address-item:hover{border-color:#d2d2d2}
.sly-address-item.selected,.sly-address-item:has(input[type="radio"]:checked){border-color:#4bae4f}
.sly-address-item input[type="radio"]{width:24px;min-width:24px;height:24px;border-radius:100%;border:1px solid #d2d2d2;appearance:none;margin:0;cursor:pointer}
.sly-address-item input[type="radio"]:checked{border:7px solid #4bae4f;background-color:#fff}
.sly-address-item label{flex:1;cursor:pointer;font-size:15px;line-height:1.2;color:#1f1f1f;margin:0;display:flex;gap:10px;align-items:flex-start}
.sly-address-icon{width:20px;height:20px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.sly-address-content{flex:1;display:flex;flex-direction:column;gap:2px}
.sly-address-content strong{display:block;font-weight:600;font-size:14px;line-height:1.3;color:#1f1f1f}
.sly-address-content span{display:block;font-size:12px;font-weight:400;line-height:1.3;color:#606060}
.sly-address-actions{position:relative;display:flex;align-items:center}
.sly-action-menu{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s}
.sly-action-menu:hover{background-color:#f0f0f0}
.sly-dropdown-menu{display:none;position:absolute;right:0;top:100%;background:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 5px 15px rgba(0,0,0,.15);padding:0;min-width:120px;z-index:10}
.sly-dropdown-menu.show{display:block}
.sly-dropdown-menu ul{list-style:none;margin:0;padding:0}
.sly-dropdown-menu li{padding:8px 12px;cursor:pointer;display:flex;align-items:center;gap:8px;color:#3167b9;font-size:14px}
.sly-dropdown-menu li:hover{background:#f0f0f0}

/* Delivery Type Selector - Matching Luma */
.sly-delivery-selector{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}
.sly-delivery-option{position:relative;border-radius:16px;padding:20px 24px;border:1px solid #e7e7e7;cursor:pointer;display:flex;gap:12px;align-items:flex-start;transition:border-color .2s}
.sly-delivery-option:hover{border-color:#d2d2d2}
.sly-delivery-option.selected,.sly-delivery-option:has(input[type="radio"]:checked){border-color:#4bae4f}
.sly-delivery-option input[type="radio"]{width:24px;min-width:24px;height:24px;border-radius:100%;border:1px solid #d2d2d2;appearance:none;margin:0;cursor:pointer;flex-shrink:0}
.sly-delivery-option input[type="radio"]:checked{border:7px solid #4bae4f;background-color:#fff}
.sly-delivery-option label{flex:1;cursor:pointer;display:flex;flex-direction:column;gap:4px;margin:0}
.sly-delivery-title{font-size:16px;font-weight:600;color:#1f1f1f;line-height:1.2}
.sly-delivery-price{margin-left:4px;font-weight:400}
.sly-delivery-subtitle{font-size:14px;font-weight:400;color:#606060;line-height:1.2}
.sly-delivery-section{transition:all .3s ease}

/* Same as Billing Checkbox */
.sly-checkbox-wrap{display:flex;align-items:center;margin-bottom:16px;cursor:pointer}
.sly-checkbox-wrap input[type="checkbox"]{display:none}
.sly-checkbox-wrap label{display:flex;align-items:center;gap:10px;cursor:pointer;margin:0;font-size:14px;color:#1f1f1f;font-weight:400}
.sly-checkbox-custom{position:relative;width:20px;min-width:20px;height:20px;border-radius:4px;border:2px solid #d2d2d2;background-color:#fff;display:flex;align-items:center;justify-content:center;transition:all .2s}
.sly-checkbox-wrap input[type="checkbox"]:checked+label .sly-checkbox-custom{background-color:#4bae4f;border-color:#4bae4f}
.sly-checkbox-wrap input[type="checkbox"]:checked+label .sly-checkbox-custom::after{content:"✓";color:#fff;font-size:12px;font-weight:bold}

/* Parcel Tabs - Matching Luma Pill Style */
.sly-parcel-tabs{display:flex;gap:0;margin-bottom:20px;background:transparent;border-radius:100px;padding:2px;border:1px solid #e7e7e7}
.sly-tab-btn{flex:1;padding:20px 24px;background:transparent;border:none;border-radius:100px;font-size:15px;font-weight:600;color:#606060;cursor:pointer;transition:all .2s}
.sly-tab-btn:hover{color:#1f1f1f;background:transparent}
.sly-tab-btn.active{background:#331cfe!important;color:#fff}
.sly-tab-content{display:none}
.sly-tab-content.active{display:block}

/* Parcel List - Matching Luma */
.sly-parcel-list{display:flex;flex-direction:column;gap:8px}
.sly-parcel-item{position:relative;border-radius:16px;padding:16px 20px;border:1px solid #e7e7e7;cursor:pointer;display:flex;flex-direction:row;align-items:center;gap:12px;transition:border-color .2s;background:#fff}
.sly-parcel-item:hover{border-color:#d2d2d2}
.sly-parcel-item.selected,.sly-parcel-item:has(input[type="radio"]:checked){border-color:#4bae4f}
.sly-parcel-item input[type="radio"]{width:24px;min-width:24px;height:24px;border-radius:100%;border:1px solid #d2d2d2;appearance:none;margin:0;cursor:pointer;flex-shrink:0}
.sly-parcel-item input[type="radio"]:checked{border:7px solid #4bae4f;background-color:#fff}
.sly-parcel-item label{flex:1;cursor:pointer;display:flex;flex-direction:row;align-items:center;gap:12px;margin:0;min-width:0}
.sly-parcel-logo{width:40px;min-width:40px;height:40px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:8px;overflow:hidden}
.sly-parcel-logo img{max-width:100%;max-height:100%;object-fit:contain}
.sly-parcel-icon{font-size:20px;line-height:1}
.sly-parcel-content{flex:1;display:flex;flex-direction:column;gap:1px;min-width:0;overflow:hidden}
.sly-parcel-content strong{font-size:14px;font-weight:600;color:#1f1f1f;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sly-parcel-address{font-size:12px;font-weight:400;color:#606060;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sly-parcel-price{font-size:13px;font-weight:600;color:#1f1f1f;margin-top:2px}
.sly-parcel-type-icon{font-size:18px;line-height:1;flex-shrink:0;opacity:.5;display:flex;align-items:center;justify-content:center;width:20px;height:20px}

/* Add Link - Matching Luma */
.sly-add-link{display:inline-flex;align-items:center;gap:6px;color:#1e1e1e;font-size:16px;font-weight:600;text-decoration:underline;cursor:pointer;background:none;border:none;padding:0}
.sly-add-link:hover{opacity:.8}

/* Footer Button - Matching Luma popup-buttons-footer */
.sly-modal-footer-btn{padding:20px 60px 34px;background:#fff;box-shadow:0 -6px 20px rgba(0,0,0,.04);flex-shrink:0;position:sticky;bottom:0;z-index:10;display:flex;flex-direction:column;gap:12px}
.sly-btn-full{width:100%;padding:19px;height:56px;border-radius:100px;font-size:16px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;max-width:100%;box-sizing:border-box}
.sly-message{text-align:center;padding:16px;color:#666;font-size:13px}
@media screen and (max-width:768px){.sly-modal-footer-btn{padding:20px 20px 34px}}

/* ==========================================
   SimplyIN Account Creation Section
   ========================================== */
.sly-account-section{background:#fff;border:1px solid #e7e7e7;border-radius:16px;padding:18px;margin-top:16px;display:none}
.sly-account-section.visible{display:block}
.sly-account-checkbox-row{margin-bottom:0}
.sly-account-checkbox-row.expanded{margin-bottom:16px}
.sly-account-checkbox-label{display:flex;align-items:center;gap:12px;cursor:pointer;margin-bottom:16px}
.sly-account-save-cb{position:relative;width:24px;min-width:24px;height:24px;border-radius:6px;border:1px solid #d2d2d2;background-color:#fff;accent-color:#4bae4f;appearance:none;-webkit-appearance:none;margin:0;cursor:pointer}
.sly-account-save-cb:checked{background-color:#000;border-color:#000}
.sly-account-save-cb:checked::after{content:"✓";color:#fff;font-size:14px;font-weight:bold;display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.sly-account-cb-text{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sly-account-cb-text strong{font-size:16px;font-weight:600;color:#1f1f1f;line-height:1.3}
.sly-account-badge-new{display:inline-grid;place-items:center;line-height:1;font-size:10px;font-weight:600;color:#d86d2b;padding:5px 12px;border-radius:4px;background-color:#f9eec6}
.sly-account-logo{height:30px;margin-left:auto}
.sly-account-benefits{list-style:none;padding:0;margin:0 0 16px 0;display:flex;flex-direction:column;gap:8px}
.sly-account-benefits li{position:relative;padding-left:24px;font-size:14px;color:#606060;line-height:1.5}
.sly-account-benefits li::before{content:"";position:absolute;left:0;top:4px;width:14px;height:14px;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGNpcmNsZSBjeD0iNyIgY3k9IjciIHI9IjciIGZpbGw9IiM0Q0FGNTAiLz4KPHBhdGggZD0iTTQgN0w2IDlMMTAgNSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4=");background-repeat:no-repeat;background-size:contain}
.sly-account-phone-wrap{border-radius:12px;margin-bottom:5px}
.sly-account-phone-container{display:flex;gap:8px;margin-bottom:8px}
.sly-account-phone-country{flex-shrink:0}
.sly-account-dropdown{width:auto;min-width:100px;position:relative}
.sly-account-dropdown-selected{height:48px;padding:0 12px;border:1px solid #dbdbdb;border-radius:8px;background-color:#fff;display:flex;align-items:center;gap:6px;cursor:pointer}
.sly-account-flag{width:24px;height:16px;object-fit:cover;border-radius:2px}
.sly-account-country-code{font-size:14px;font-weight:500;color:#1f1f1f}
.sly-account-dropdown-arrow{font-size:10px;color:#666}
.sly-account-phone-input-wrap{flex:1}
.sly-account-phone-input{width:100%;height:48px;padding:0 16px;border:1px solid #dbdbdb;border-radius:8px;font-size:16px;color:#1f1f1f;background-color:#fff;outline:none}
.sly-account-phone-input:focus{border-color:#4a90e2}
.sly-account-phone-input::placeholder{color:#999}
.sly-account-phone-error{color:#e52424;font-size:13px;margin-top:8px;margin-bottom:8px;display:none}
.sly-account-phone-error.visible{display:block}
.sly-account-description{margin:12px 0 20px}
.sly-account-description p{color:#606060;font-size:13px;line-height:1.5;margin:0}
.sly-account-terms{padding:16px 12px;background-color:#f5f5f5;border-bottom-left-radius:20px;border-bottom-right-radius:20px;text-align:center;margin:-6px -6px 0}
.sly-account-terms-inner{font-size:14px;color:#1f1f1f;line-height:1.6;text-align:center;margin-bottom:12px}
.sly-account-terms-inner a{text-decoration:underline;color:#1f1f1f}
.sly-account-security{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;color:#808080;font-weight:500}
.sly-account-dropdown-options{display:none;position:absolute;top:100%;left:0;right:0;margin-top:4px;max-height:300px;background-color:#fff;border:1px solid #dbdbdb;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:1000;flex-direction:column;min-width:280px}
.sly-account-dropdown-options.open{display:flex}
.sly-account-country-search{padding:10px;border-bottom:1px solid #e0e0e0}
.sly-account-country-search input{width:100%;height:36px;padding:8px 12px;border:1px solid #dbdbdb;border-radius:6px;font-size:14px;outline:none}
.sly-account-country-list{max-height:220px;overflow-y:auto}
.sly-account-country-option{display:flex;align-items:center;gap:10px;padding:10px 12px;cursor:pointer;transition:background-color .2s}
.sly-account-country-option:hover{background-color:#f5f5f5}
.sly-account-country-option .name{flex:1;font-size:14px;color:#1f1f1f}
.sly-account-country-option .code{font-size:14px;color:#606060}
@media screen and (max-width:768px){.sly-account-section{padding:14px;border-radius:12px}.sly-account-phone-container{flex-direction:column}}

/* Add Address Form Styles - Matching Luma */
.sly-add-form{padding:0}
.sly-add-form .sly-form-row{display:flex;gap:12px;margin-bottom:16px}
.sly-add-form .sly-form-row .sly-form-group{flex:1}
.sly-add-form .sly-form-group{margin-bottom:16px}
.sly-add-form .sly-form-group input,.sly-add-form .sly-form-group select{width:100%;padding:16px 20px;border:1px solid #dbdbdb;border-radius:8px;font-size:16px;outline:none;background:#fff;height:56px;color:#1f1f1f;font-weight:400;transition:border-color .2s;box-sizing:border-box}
.sly-add-form .sly-form-group input:focus,.sly-add-form .sly-form-group select:focus{border-color:#000}
.sly-add-form .sly-form-group input::placeholder{color:#999;font-size:16px}
.sly-add-form .sly-form-group select{appearance:none;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNiIgdmlld0JveD0iMCAwIDEwIDYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xIDFMNSA1TDkgMSIgc3Ryb2tlPSIjMUYxRjFGIiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K");background-repeat:no-repeat;background-position:right 16px center;background-size:10px;cursor:pointer}
.sly-add-form .sly-form-section-title{font-size:16px;font-weight:600;color:#1f1f1f;margin:24px 0 12px}
.sly-add-form .sly-form-section-desc{font-size:14px;color:#757575;margin-bottom:12px;line-height:1.4}
.sly-add-form .sly-form-actions{display:flex;flex-direction:column;gap:12px;padding:20px 60px 34px;position:sticky;bottom:-20px;background:#fff;box-shadow:0 -6px 20px rgba(0,0,0,.04);z-index:10;margin:0 -60px}
.sly-add-form .sly-form-actions .sly-btn-full{border:none;max-width:100%}
.sly-add-form .sly-btn-cancel{width:100%;padding:19px;height:56px;border-radius:100px;font-size:16px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:1px solid #1e1e1e;color:#1e1e1e;cursor:pointer;transition:all .2s}
.sly-add-form .sly-btn-cancel:hover{background:#f5f5f5}
.sly-modal-footer-btn .sly-btn-cancel{width:100%;padding:19px;height:56px;border-radius:100px;font-size:16px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:1px solid #1e1e1e;color:#1e1e1e;cursor:pointer;transition:all .2s;box-sizing:border-box}
.sly-modal-footer-btn .sly-btn-cancel:hover{background:#f5f5f5}
@media screen and (max-width:768px){.sly-add-form .sly-form-row{flex-direction:column;gap:0}.sly-add-form .sly-form-group input,.sly-add-form .sly-form-group select{font-size:15px;padding:16px}.sly-add-form .sly-form-actions{padding:20px 20px 34px;margin:0 -20px}}

/* Pickup Point Search Styles */
.sly-search-group{position:relative;margin-bottom:16px}
.sly-search-group input{width:100%;padding:16px 20px 16px 48px;border:1px solid #dbdbdb;border-radius:8px;font-size:16px;outline:none;background:#fff;height:56px;color:#1f1f1f;box-sizing:border-box}
.sly-search-group input:focus{border-color:#2a5ff2}
.sly-search-group .sly-search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#999}
.sly-search-results{margin-bottom:16px}
.sly-search-placeholder{background:#f5f5f5;border-radius:12px;padding:40px 20px;text-align:center;margin-bottom:16px}
.sly-search-placeholder svg{margin-bottom:12px;width:100%;}
.sly-search-placeholder p{color:#666;font-size:14px;margin:0}
.sly-autocomplete-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #dbdbdb;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:100;max-height:250px;overflow-y:auto;display:none}
.sly-autocomplete-dropdown.open{display:block}
.sly-autocomplete-item{display:flex;align-items:center;gap:10px;padding:12px 16px;cursor:pointer;transition:background .2s}
.sly-autocomplete-item:hover,.sly-autocomplete-item.focused{background:#f5f5f5}
.sly-autocomplete-item .icon{color:#E74C3C;flex-shrink:0}
.sly-autocomplete-item .text{font-size:14px;color:#1f1f1f}
.sly-pickup-result{border:1px solid #e7e7e7;border-radius:12px;padding:14px 16px;margin-bottom:8px;display:flex;align-items:center;gap:12px;cursor:pointer;transition:border-color .2s}
.sly-pickup-result:hover{border-color:#d2d2d2}
.sly-pickup-result.selected{border-color:#4bae4f}
.sly-pickup-result input[type="radio"]{width:20px;min-width:20px;height:20px;border-radius:100%;border:1px solid #d2d2d2;appearance:none;margin:0;cursor:pointer;flex-shrink:0}
.sly-pickup-result input[type="radio"]:checked{border:6px solid #4bae4f;background-color:#fff}
.sly-pickup-result .logo{width:36px;min-width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:6px;overflow:hidden}
.sly-pickup-result .logo img{max-width:100%;max-height:100%;object-fit:contain}
.sly-pickup-result .info{flex:1;min-width:0}
.sly-pickup-result .info strong{display:block;font-size:14px;font-weight:600;color:#1f1f1f}
.sly-pickup-result .info span{display:block;font-size:12px;color:#606060}
.sly-pickup-result .info .price{font-size:13px;font-weight:600;color:#1f1f1f;margin-top:2px}
.sly-pickup-result .info .distance{font-size:11px;color:#999}
.sly-detail-row{display:flex;gap:8px;margin-bottom:4px;font-size:14px}
.sly-detail-row .label{color:#606060;min-width:120px}
.sly-detail-row .value{color:#1f1f1f;font-weight:500}


/* === SimplyIN Hyva - Payment Status (Success Page) === */

.sly-ps{max-width:440px;margin:20px 0;border:2px solid #3b82f6;border-radius:16px;padding:28px 24px;background:#fff;font-family:"Inter Tight",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.sly-ps-header{text-align:center;margin-bottom:20px}
.sly-ps-title{font-size:15px;color:#606060;margin-bottom:10px}
.sly-ps-logos{display:flex;align-items:center;justify-content:center;gap:8px}
.sly-ps-logos img{height:24px}
.sly-ps-logos .sep{font-size:14px;color:#999}
.sly-ps-method{display:flex;align-items:center;gap:12px;padding:16px;border:1px solid #e7e7e7;border-radius:12px;margin-bottom:20px}
.sly-ps-method input[type="radio"]{width:20px;height:20px;accent-color:#2d40f6}
.sly-ps-method-info{display:flex;align-items:center;gap:8px;flex:1}
.sly-ps-method-info img{height:24px;width:auto}
.sly-ps-method-name{font-size:14px;font-weight:500;color:#1f1f1f}
.sly-ps-method-check{color:#22c55e;font-size:18px;font-weight:bold}
.sly-ps-status{display:flex;align-items:flex-start;gap:12px;padding:12px 0}
.sly-ps-icon{width:28px;height:28px;flex-shrink:0}
.sly-ps-msg{flex:1}
.sly-ps-main{font-size:15px;font-weight:600;color:#1f1f1f;margin:0 0 4px}
.sly-ps-sub{font-size:13px;color:#606060;margin:0}
.sly-ps-sub.success{color:#22c55e}
.sly-ps-sub.failed{color:#ef4444}
.sly-ps-spinner{display:flex;justify-content:center;margin-top:12px}
.sly-ps-spin{width:24px;height:24px;border:3px solid #e5e5e5;border-top-color:#3b82f6;border-radius:50%;animation:slyspn 1s linear infinite}
@keyframes slyspn{to{transform:rotate(360deg)}}

/* Utility: hidden elements on payment status */
.sly-ps-hidden{display:none}


/* === Additional Classes for JS-Generated HTML (email-integration.phtml) === */

/* Push notification modal body centered */
.sly-modal-body--centered { text-align: center; }

/* Push notification caption spacing */
.sly-modal-caption--push { margin-bottom: 24px; }

/* Push loading wrapper */
.sly-push-loading { margin: 20px 0; }

/* Push spinner (inline in modal) */
.sly-push-spin {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 3px solid #f3f3f3;
    border-top: 3px solid #2D40F6;
    border-radius: 50%;
    animation: slyspin 1s linear infinite;
}

/* Push status text */
.sly-push-status-text { margin-top: 10px; color: #666; font-size: 14px; }

/* Push footer section */
.sly-push-footer { text-align: center; padding: 20px 60px 30px; }
.sly-push-footer-title { font-size: 17px; font-weight: 700; color: #1f1f1f; margin-bottom: 24px; }
.sly-push-footer-buttons { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; }
.sly-push-footer-or { font-size: 16px; color: #606060; }
@media screen and (max-width: 768px) {
    .sly-push-footer { padding: 20px 20px 30px; }
    .sly-push-footer-buttons { flex-direction: column; gap: 10px; }
    .sly-push-footer-or { display: none; }
}

/* Resend buttons inline alignment */
.sly-resend .sly-btn { max-width: 187px; display: inline-flex; justify-content: center; }
.sly-resend-or { margin: 0 8px; color: #606060; font-size: 16px; font-weight: 600; }

/* Account details body padding */
.sly-account-body { padding: 0 60px 15px; }
@media screen and (max-width: 768px) { .sly-account-body { padding: 0 20px 15px; } }

/* Account loading state */
.sly-account-loading { justify-content: center; padding: 40px; }

/* Section title with top margin */
.sly-section-title--delivery { margin-top: 24px; }
.sly-section-title--parcel { margin-top: 16px; }

/* Checkbox wrap with top margin */
.sly-checkbox-wrap--spaced { margin-top: 16px; }

/* Centered action links in sections */
.sly-centered-action { text-align: center; margin-top: 12px; }

/* Form padding override */
.sly-add-form--padded { padding: 0 10px 12px; }

/* Form section title top spacing */
.sly-form-section-title--spaced { margin-top: 24px; }

/* Full width button override */
.sly-btn-full--no-border { border: none; width: 100%; max-width: 100%; }

/* Dropdown message states */
.sly-dropdown-message { padding: 12px; text-align: center; }
.sly-dropdown-message--muted { color: #666; }
.sly-dropdown-message--error { color: #e52424; }

/* Search loading spinner inline */
.sly-search-loading { padding: 20px; text-align: center; color: #666; }
.sly-search-loading .sly-loader-spin {
    display: inline-block;
    width: 24px;
    height: 24px;
    border: 3px solid #e5e5e5;
    border-top-color: #2a5ff2;
    border-radius: 50%;
    animation: slyspin 1s linear infinite;
    margin-bottom: 8px;
}

/* Hidden config element */
.sly-config-hidden { display: none; }

.sly-resend .sly-btn:hover,
body .sly-btn,
body button#simplyin-use-address,
body .sly-btn-full:hover {
    background: linear-gradient(90deg, #0ad0cc 0%, #2a5ff2 50%, #b922f9 100%);
    color: #ffffff;
    border: none;
}

/* === CCIframe Card Field Containers === */
#simplyin-card-number,#simplyin-card-expiry,#simplyin-card-cvv{min-height:48px;display:flex;align-items:center}
#simplyin-card-number iframe,#simplyin-card-expiry iframe,#simplyin-card-cvv iframe{height:40px!important;min-height:40px!important;width:100%!important}
#simplyin-card-number .ccframe-component,#simplyin-card-expiry .ccframe-component,#simplyin-card-cvv .ccframe-component{width:100%;height:100%;display:flex;align-items:center}

/* === Test environment notice — visible while Environment is set to Test (non-production) === */
.simplyin-test-environment-notice {
    background-color: #fffbe6;
    border: 1px solid #eebe3f;
    color: #6f4400;
    font-weight: 600;
    padding: 12px 16px;
    margin-bottom: 20px;
    text-align: center;
}

/* Persistent field badge - shown next to the login e-mail input from page load, see
   login/shop-login-otp.phtml's injectFieldBadge(). */
.simplyin-login-field-wrap {
    position: relative;
}

.simplyin-login-field-wrap .form-input {
    padding-right: 36px;
}

.simplyin-login-field-badge {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    pointer-events: none;
}