:root{--primary-color:#bfa054;--primary-dark:#a88a40;--primary-light:#d9c28c;--primary-bg:#f7f3ea;--text-color:#333;--border-color:#e0e0e0;--success-color:#4caf50;--error-color:#f44336;--info-color:#2196f3;--shadow:0 2px 10px #0000001a}html,body{height:100%;margin:0;padding:0;overflow-y:auto}body{color:#333;background-color:#f5f5f5;font-family:Arial,sans-serif}.email-admin-container{box-shadow:var(--shadow);background:#fff;border-radius:12px;max-width:900px;max-height:none;margin:40px auto 80px;position:relative;overflow:visible}.email-admin-header{background:var(--primary-bg);border-bottom:1px solid var(--border-color);padding:24px 32px;position:relative}.email-admin-header h1{color:var(--primary-color);margin:0;font-size:28px}.provider-badge{background:var(--primary-color);color:#fff;border-radius:20px;padding:6px 12px;font-size:14px;font-weight:500;position:absolute;top:24px;right:32px}.email-admin-content{max-height:none;padding:32px;position:relative;overflow:hidden auto}.email-admin-footer{border-top:1px solid var(--border-color);background:#f9f9f9;padding:20px 32px}.step-indicator{border-radius:8px;margin-bottom:32px;display:flex;overflow:hidden}.step{text-align:center;color:#666;background:#f0f0f0;flex:1;padding:12px;font-weight:500;position:relative}.step:not(:last-child):after{content:"";z-index:1;background:#f0f0f0;width:30px;height:100%;position:absolute;top:0;right:-15px;transform:skew(30deg)}.step.active{background:var(--primary-color);color:#fff}.step.active:not(:last-child):after{background:var(--primary-color)}.step.completed{background:var(--primary-light);color:#fff}.step.completed:not(:last-child):after{background:var(--primary-light)}.email-template-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:24px;margin-top:24px;display:grid}.email-template-card{border:1px solid var(--border-color);cursor:pointer;background:#fff;border-radius:8px;padding:24px;transition:all .2s;position:relative;overflow:hidden}.email-template-card:hover{box-shadow:var(--shadow);border-color:var(--primary-color);transform:translateY(-4px)}.email-template-card h3{color:var(--primary-color);margin:16px 0 8px}.email-template-card p{color:#666;margin:0;font-size:14px}.template-icon{font-size:32px;display:inline-block}.form-header{align-items:center;margin-bottom:24px;display:flex;position:relative}.form-header h2{color:var(--primary-color);flex:1;margin:0}.back-button{color:var(--primary-color);cursor:pointer;background:0 0;border:none;margin-right:16px;padding:8px 0;font-size:16px;font-weight:500}.back-button:hover{text-decoration:underline}.template-badge{background:var(--primary-bg);border-radius:20px;align-items:center;padding:8px 16px;display:flex}.template-badge .template-icon{margin-right:8px;font-size:20px}.form-section{background:#f9f9f9;border-radius:8px;max-height:500px;margin-bottom:32px;padding:24px;overflow-y:auto}.form-section h3{color:var(--text-color);margin-top:0;margin-bottom:16px;font-size:18px}.form-group{margin-bottom:16px}.form-group label{color:var(--text-color);margin-bottom:8px;font-weight:500;display:block}.form-group input,.form-group textarea,.form-group select{border:1px solid var(--border-color);border-radius:6px;width:100%;padding:12px;font-size:16px;transition:border-color .2s}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--primary-color);outline:none;box-shadow:0 0 0 2px #bfa05433}.form-group textarea{resize:vertical;box-sizing:border-box;width:100%;height:auto;min-height:100px;max-height:300px;padding:12px;font-family:inherit;display:block;overflow-x:hidden;overflow-y:auto!important}.json-preview{background:#f0f0f0;border-radius:6px;margin-top:24px;padding:16px}.json-preview h4{color:#555;margin-top:0;margin-bottom:8px;font-size:14px}.json-preview pre{background:#fff;border-radius:4px;max-height:120px;margin:0;padding:12px;font-size:14px;overflow:auto}.form-actions{z-index:100;border-top:1px solid var(--border-color);background:#fff;justify-content:flex-end;margin-top:24px;padding:15px 0;display:flex;position:sticky;bottom:0}.preview-button,.send-button{background:var(--primary-color);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:12px 24px;font-size:16px;font-weight:500;transition:background-color .2s}.preview-button:hover,.send-button:hover{background:var(--primary-dark)}.preview-button:disabled,.send-button:disabled{cursor:not-allowed;background:#ccc}.email-preview{background:#fff}.preview-container{border:1px solid var(--border-color);border-radius:8px;overflow:hidden}.preview-header{border-bottom:1px solid var(--border-color);background:#f0f0f0;padding:16px}.preview-field{margin-bottom:8px;display:flex}.preview-field:last-child{margin-bottom:0}.field-label{color:#555;width:80px;font-weight:500}.field-value{flex:1}.preview-content{padding:24px}.preview-template h3{color:var(--primary-color);margin-top:0}.template-description{color:#666;margin-bottom:24px}.preview-data{background:var(--primary-bg);border-radius:6px;padding:16px}.preview-data p{margin:8px 0}.preview-data pre{background:#fff;border-radius:4px;margin:8px 0;padding:12px;overflow-x:auto}.custom-message{border-top:1px dashed #ccc;margin-top:16px;padding-top:16px}.custom-message h4{color:#555;margin-top:0}.status-message{border-radius:6px;align-items:center;margin-top:16px;padding:12px 16px;display:flex}.status-message.success{color:var(--success-color);background-color:#4caf501a}.status-message.error{color:var(--error-color);background-color:#f443361a}.status-message.info{color:var(--info-color);background-color:#2196f31a}.status-icon{margin-right:12px;font-size:20px}.loading-spinner{padding-left:24px;position:relative}.loading-spinner:before{content:"";border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:16px;height:16px;margin-top:-8px;animation:1s linear infinite spin;position:absolute;top:50%;left:0}@keyframes spin{to{transform:rotate(360deg)}}.info-box{background:var(--primary-bg);border-left:4px solid var(--primary-color);border-radius:8px;padding:16px}.info-box h4{color:var(--primary-color);margin-top:0;margin-bottom:8px}.info-box p{margin:0;font-size:14px;line-height:1.5}@media (width<=768px){.email-admin-container{border-radius:8px;margin:20px}.email-admin-header,.email-admin-content,.email-admin-footer{padding:16px}.email-template-grid{grid-template-columns:1fr}.step{padding:8px 4px;font-size:14px}.form-section{padding:16px}}