*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f8f9fa;color:#333;line-height:1.6}html{scroll-behavior:smooth}#root{min-height:100vh}h1,h2,h3,h4,h5,h6{margin:0 0 1rem;font-weight:600;line-height:1.2}p{margin:0 0 1rem}button{font-family:inherit;cursor:pointer;transition:all .3s ease}input,textarea{font-family:inherit}a{color:#ff6b35;text-decoration:none;transition:color .3s ease}a:hover{color:#f7931e}.container{max-width:1200px;margin:0 auto;padding:0 20px}.text-center{text-align:center}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.mb-4{margin-bottom:2rem}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mt-4{margin-top:2rem}.spinner{width:20px;height:20px;border:2px solid #f3f3f3;border-top:2px solid #ff6b35;border-radius:50%;animation:spin 1s linear infinite}.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#ff6b35,#f7931e);padding:20px}.auth-card{background:#fff;border-radius:12px;box-shadow:0 20px 40px #0000001a;padding:40px;width:100%;max-width:400px;animation:slideUp .5s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.auth-header{text-align:center;margin-bottom:30px}.auth-header h1{color:#333;font-size:2rem;font-weight:700;margin-bottom:8px}.auth-header p{color:#666;font-size:1rem;margin:0}.auth-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{color:#333;font-weight:600;font-size:.9rem}.form-group input{padding:12px 16px;border:2px solid #e1e1e1;border-radius:8px;font-size:1rem;transition:all .3s ease;background:#fff}.form-group input:focus{outline:none;border-color:#ff6b35;box-shadow:0 0 0 3px #ff6b351a}.form-group input::placeholder{color:#999}.auth-button{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:8px;padding:14px 24px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:10px}.auth-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #ff6b354d}.auth-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.auth-footer{text-align:center;margin-top:30px;padding-top:20px;border-top:1px solid #e1e1e1}.auth-footer p{color:#666;margin:0}.auth-footer a{color:#ff6b35;text-decoration:none;font-weight:600;transition:color .3s ease}.auth-footer a:hover{color:#f7931e}@media(max-width:768px){.auth-container{padding:10px}.auth-card{padding:30px 20px}.auth-header h1{font-size:1.75rem}}.dashboard-container{min-height:100vh;background:#f8f9fa}.dashboard-header{background:#fff;border-bottom:1px solid #e1e1e1;box-shadow:0 2px 10px #0000000d}.header-content{max-width:1200px;margin:0 auto;padding:20px;display:flex;justify-content:space-between;align-items:center}.header-content h1{color:#333;font-size:2rem;font-weight:700;margin:0}.header-actions{display:flex;align-items:center;gap:20px}.new-store-button{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:8px;padding:10px 20px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease}.new-store-button:hover{transform:translateY(-1px);box-shadow:0 8px 20px #ff6b354d}.user-info{display:flex;align-items:center;gap:20px}.user-info span{color:#666;font-weight:500}.logout-button{background:#333;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease}.logout-button:hover{background:#ff6b35;transform:translateY(-1px)}.dashboard-main{max-width:1200px;margin:0 auto;padding:40px 20px}.stores-section{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d;margin-bottom:40px}.stores-section h2{color:#333;font-size:1.5rem;font-weight:600;margin-bottom:25px}.loading-container{display:flex;flex-direction:column;align-items:center;padding:40px;gap:15px}.loading-container p{color:#666;font-size:1rem}.stores-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.store-card{background:#f8f9fa;border:2px solid #e1e1e1;border-radius:12px;padding:25px;text-align:center;transition:all .3s ease;position:relative;overflow:hidden}.store-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px #00000026;border-color:#ff6b35}.store-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#ff6b35,#f7931e)}.store-icon{font-size:3.5rem;margin-bottom:15px;display:block}.store-title{color:#333;font-size:1.25rem;font-weight:700;margin-bottom:10px;line-height:1.3}.store-meta{margin-bottom:20px}.store-date{color:#666;font-size:.85rem;display:block;margin-bottom:8px}.store-url-info{display:flex;align-items:center;gap:6px;margin-top:8px}.store-url-info .url-label{color:#888;font-size:.75rem;font-weight:500}.store-url-info .store-url-link{color:#ff6b35;font-size:.75rem;text-decoration:none;font-weight:500;font-family:Monaco,Menlo,Ubuntu Mono,monospace;transition:color .3s ease}.store-url-info .store-url-link:hover{color:#f7931e;text-decoration:underline}.empty-stores{text-align:center;padding:60px 20px;color:#666}.empty-stores h3{color:#333;font-size:1.5rem;margin-bottom:10px}.empty-stores p{font-size:1rem;color:#666}.upload-section{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d;margin-bottom:40px}.upload-section h2{color:#333;font-size:1.5rem;font-weight:600;margin-bottom:20px}.upload-area{border:2px dashed #e1e1e1;border-radius:12px;padding:60px 20px;text-align:center;transition:all .3s ease;cursor:pointer}.upload-area:hover{border-color:#ff6b35;background:#fff8f6}.upload-prompt{display:flex;flex-direction:column;align-items:center;gap:12px}.upload-icon{font-size:3rem;margin-bottom:10px}.upload-prompt p{color:#333;font-size:1.1rem;font-weight:600;margin:0}.upload-hint{color:#666;font-size:.9rem}.upload-progress{display:flex;flex-direction:column;align-items:center;gap:15px}.progress-bar{width:100%;max-width:300px;height:8px;background:#e1e1e1;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#ff6b35,#f7931e);border-radius:4px;transition:width .3s ease}.upload-progress p{color:#333;font-weight:600;margin:0}.files-section{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d}.files-section h2{color:#333;font-size:1.5rem;font-weight:600;margin-bottom:20px}.files-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}.file-item{background:#f8f9fa;border-radius:8px;padding:20px;text-align:center;transition:all .3s ease;border:1px solid #e1e1e1}.file-item:hover{transform:translateY(-4px);box-shadow:0 8px 20px #0000001a;border-color:#ff6b35}.file-preview{margin-bottom:15px;height:100px;display:flex;align-items:center;justify-content:center;border-radius:6px;overflow:hidden;background:#fff}.file-preview img{max-width:100%;max-height:100%;object-fit:cover;border-radius:4px}.file-icon{font-size:2.5rem;color:#666}.file-link{display:inline-block;background:#ff6b35;color:#fff;text-decoration:none;padding:8px 16px;border-radius:6px;font-size:.9rem;font-weight:600;transition:all .3s ease}.file-link:hover{background:#f7931e;transform:translateY(-1px)}.error-message{background:#fee;color:#c33;padding:12px 16px;border-radius:8px;border:1px solid #fcc;font-size:.9rem;margin-bottom:20px}@media(max-width:768px){.header-content{flex-direction:column;gap:15px;text-align:center}.header-actions{flex-direction:column;width:100%}.new-store-button{width:100%}.dashboard-main{padding:20px 10px}.stores-section,.upload-section,.files-section{padding:20px}.stores-grid{grid-template-columns:1fr;gap:15px}.store-card{padding:20px}.empty-stores,.upload-area{padding:40px 15px}.files-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:15px}.file-item{padding:15px}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal{background:#fff;border-radius:12px;box-shadow:0 20px 40px #00000026;max-width:500px;width:100%;max-height:90vh;overflow:auto;animation:modalSlideUp .3s ease-out}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.modal-header{padding:30px 30px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e1e1e1;margin-bottom:0}.modal-header h2{color:#333;font-size:1.5rem;font-weight:600;margin:0}.close-button{background:none;border:none;font-size:2rem;color:#999;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;transition:color .3s ease}.close-button:hover{color:#333}.modal-body{padding:30px}.modal-body .form-group{margin-bottom:0}.modal-body .form-group label{color:#333;font-weight:600;font-size:.9rem;margin-bottom:8px;display:block}.modal-body .form-group input{width:100%;padding:12px 16px;border:2px solid #e1e1e1;border-radius:8px;font-size:1rem;transition:all .3s ease;background:#fff}.modal-body .form-group input:focus{outline:none;border-color:#ff6b35;box-shadow:0 0 0 3px #ff6b351a}.modal-body .form-group small{color:#666;font-size:.85rem;margin-top:5px;display:block}.modal-footer{padding:0 30px 30px;display:flex;gap:12px;justify-content:flex-end}.cancel-button{background:#f8f9fa;color:#333;border:1px solid #e1e1e1;border-radius:8px;padding:10px 20px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease}.cancel-button:hover{background:#e9ecef}.create-button{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:8px;padding:10px 20px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease}.create-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 15px #ff6b354d}.create-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.store-actions{display:flex;gap:10px;align-items:center;margin-top:15px}.manage-button{flex:1;background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .3s ease}.manage-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ff6b354d}.delete-button{background:#dc3545;color:#fff;border:none;border-radius:6px;padding:8px;font-size:.9rem;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;min-width:36px;height:36px}.delete-button:hover{background:#c82333;transform:translateY(-1px);box-shadow:0 4px 12px #dc35454d}.delete-modal{max-width:500px;width:90%}.delete-modal .modal-body{text-align:center;padding:30px 20px}.warning-icon{font-size:3rem;margin-bottom:20px;color:#ff9800}.delete-modal h3{color:#333;font-size:1.3rem;margin-bottom:15px;font-weight:600}.delete-modal p{color:#666;font-size:1rem;line-height:1.5;margin-bottom:20px}.store-details{background:#f8f9fa;border-radius:8px;padding:15px;margin:20px 0;text-align:left}.store-details p{margin:5px 0;font-size:.9rem;color:#555}.delete-confirm-button{background:#dc3545;color:#fff;border:none;border-radius:8px;padding:10px 20px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease}.delete-confirm-button:hover:not(:disabled){background:#c82333;transform:translateY(-1px);box-shadow:0 6px 15px #dc35454d}.delete-confirm-button:disabled{opacity:.7;cursor:not-allowed;transform:none}.store-manager{min-height:100vh;background:#f8f9fa}.store-header{background:#fff;border-bottom:1px solid #e1e1e1;box-shadow:0 2px 10px #0000000d}.header-content{max-width:1400px;margin:0 auto;padding:20px;display:flex;justify-content:space-between;align-items:center}.header-left{display:flex;align-items:center;gap:20px}.back-button{background:#f8f9fa;color:#333;border:1px solid #e1e1e1;border-radius:6px;padding:8px 16px;font-size:.9rem;cursor:pointer;transition:all .3s ease}.back-button:hover{background:#e9ecef}.store-info h1{color:#333;font-size:1.5rem;font-weight:700;margin:0 0 4px}.store-id{color:#666;font-size:.85rem}.header-right{display:flex;align-items:center;gap:20px}.preview-button{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease}.preview-button:hover{transform:translateY(-1px);box-shadow:0 4px 10px #ff6b354d}.user-menu{display:flex;align-items:center;gap:12px}.user-menu span{color:#666;font-size:.9rem}.logout-button{background:#333;color:#fff;border:none;border-radius:4px;padding:6px 12px;font-size:.85rem;cursor:pointer;transition:background .3s ease}.logout-button:hover{background:#555}.store-content{max-width:1400px;margin:0 auto;display:flex;min-height:calc(100vh - 80px)}.store-sidebar{width:260px;background:#fff;border-right:1px solid #e1e1e1;padding:30px 0}.nav-sections{display:flex;flex-direction:column;gap:4px;padding:0 20px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 16px;background:none;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;text-align:left;width:100%}.nav-item:hover{background:#f8f9fa}.nav-item.active{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff}.nav-icon{font-size:1.2rem;min-width:20px}.nav-label{font-size:.95rem;font-weight:500}.store-main{flex:1;padding:30px;overflow-y:auto}.tab-content{max-width:1000px}.tab-content h3{color:#333;font-size:1.5rem;font-weight:600;margin-bottom:25px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:40px}.stat-card{background:#fff;border-radius:12px;padding:25px;box-shadow:0 4px 15px #0000000d;display:flex;align-items:center;gap:20px}.stat-icon{font-size:2.5rem;background:#f8f9fa;border-radius:12px;padding:15px;min-width:60px;text-align:center}.stat-info h3{color:#666;font-size:.9rem;font-weight:500;margin:0 0 8px}.stat-value{color:#333;font-size:1.8rem;font-weight:700;margin:0 0 4px}.stat-change{color:#666;font-size:.8rem}.recent-activity{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d}.recent-activity h3{margin-bottom:20px}.activity-list{display:flex;flex-direction:column;gap:15px}.activity-item{display:flex;align-items:center;gap:15px;padding:15px;background:#f8f9fa;border-radius:8px}.activity-icon{font-size:1.5rem;background:#fff;border-radius:8px;padding:8px}.activity-content p{margin:0 0 4px;color:#333}.activity-content span{color:#666;font-size:.9rem}.form-section{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d}.form-group{margin-bottom:25px}.form-group label{display:block;color:#333;font-weight:600;margin-bottom:8px;font-size:.9rem}.form-group input,.form-group textarea,.form-group select{width:100%;padding:12px 16px;border:2px solid #e1e1e1;border-radius:8px;font-size:1rem;transition:border-color .3s ease}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:#ff6b35}.file-upload-area{border:2px dashed #e1e1e1;border-radius:8px;padding:40px;text-align:center;cursor:pointer;transition:all .3s ease}.file-upload-area:hover{border-color:#ff6b35;background:#fff8f6}.upload-placeholder{display:flex;flex-direction:column;align-items:center;gap:10px}.upload-icon{font-size:2rem;color:#666}.save-button{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:8px;padding:12px 24px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.save-button:hover{transform:translateY(-1px);box-shadow:0 6px 15px #ff6b354d}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.add-button,.cta-button{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:8px;padding:10px 20px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease}.add-button:hover,.cta-button:hover{transform:translateY(-1px);box-shadow:0 4px 10px #ff6b354d}.filter-tabs{display:flex;gap:8px}.filter-tab{background:#f8f9fa;color:#666;border:1px solid #e1e1e1;border-radius:6px;padding:8px 16px;font-size:.9rem;cursor:pointer;transition:all .3s ease}.filter-tab.active,.filter-tab:hover{background:#ff6b35;color:#fff;border-color:#ff6b35}.empty-state{background:#fff;border-radius:12px;padding:60px 30px;text-align:center;box-shadow:0 4px 15px #0000000d}.empty-icon{font-size:4rem;margin-bottom:20px;opacity:.7}.empty-state h4{color:#333;font-size:1.3rem;margin-bottom:10px}.empty-state p{color:#666;margin-bottom:25px}.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.setting-card{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d;text-align:center}.setting-card h4{color:#333;margin-bottom:10px}.setting-card p{color:#666;margin-bottom:20px}.setup-button{background:#f8f9fa;color:#333;border:1px solid #e1e1e1;border-radius:6px;padding:10px 20px;font-size:.9rem;cursor:pointer;transition:all .3s ease}.setup-button:hover{background:#e9ecef}.analytics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:20px}.chart-placeholder{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d}.chart-placeholder h4{color:#333;margin-bottom:20px}.chart-mock{background:#f8f9fa;border-radius:8px;padding:40px;text-align:center;color:#666;font-size:1.1rem}.marketing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.marketing-card{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d;text-align:center}.marketing-icon{font-size:2.5rem;margin-bottom:15px}.marketing-card h4{color:#333;margin-bottom:10px}.marketing-card p{color:#666;margin-bottom:20px}.marketing-button{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease}.marketing-button:hover{transform:translateY(-1px);box-shadow:0 4px 10px #ff6b354d}.billing-section{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d}.plan-card{border:2px solid #e1e1e1;border-radius:12px;padding:25px;margin-bottom:30px;position:relative}.plan-card.current{border-color:#ff6b35}.plan-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.plan-badge{background:#ff6b35;color:#fff;padding:4px 12px;border-radius:20px;font-size:.8rem;font-weight:500}.plan-price{font-size:2rem;font-weight:700;color:#333;margin-bottom:20px}.plan-price span{font-size:1rem;color:#666;font-weight:400}.plan-features{list-style:none;padding:0;margin:0}.plan-features li{padding:8px 0;font-size:.9rem}.payment-methods h4{margin-bottom:20px}.payment-grid{display:flex;gap:15px}.payment-option{display:flex;align-items:center;gap:10px;padding:15px;border:1px solid #e1e1e1;border-radius:8px;flex:1}.payment-icon{font-size:1.5rem}.connect-button{background:#f8f9fa;color:#333;border:1px solid #e1e1e1;border-radius:4px;padding:6px 12px;font-size:.8rem;cursor:pointer;margin-left:auto}.connect-button:hover{background:#e9ecef}.settings-sections{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d}.settings-group{margin-bottom:40px;padding-bottom:30px;border-bottom:1px solid #e1e1e1}.settings-group:last-child{border-bottom:none;margin-bottom:0}.settings-group h4{color:#333;margin-bottom:20px}.setting-item{margin-bottom:20px}.setting-item label{display:block;color:#333;font-weight:500;margin-bottom:8px}.setting-item.checkbox{display:flex;align-items:center;gap:10px}.setting-item.checkbox input{width:auto;margin:0}.setting-item.checkbox label{margin:0;cursor:pointer}.danger-zone{border:1px solid #dc3545;border-radius:8px;padding:20px;background:#fff5f5}.danger-zone h4{color:#dc3545;margin-bottom:15px}.danger-button{background:#dc3545;color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:.9rem;cursor:pointer;transition:background .3s ease}.danger-button:hover{background:#c82333}.design-preview{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 15px #0000000d;margin-top:20px}.preview-placeholder{text-align:center;padding:60px 30px;border:2px dashed #e1e1e1;border-radius:12px;background:#f8f9fa}.preview-icon{font-size:4rem;margin-bottom:20px;opacity:.7}.design-preview h4{color:#333;font-size:1.5rem;margin-bottom:15px}.design-preview p{color:#666;margin-bottom:30px;font-size:1.1rem}.design-button,.preview-button{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:8px;padding:12px 24px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.design-button:hover,.preview-button:hover{transform:translateY(-2px);box-shadow:0 8px 20px #ff6b354d}.loading-container,.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;gap:20px}.spinner{width:40px;height:40px;border:3px solid #f3f3f3;border-top:3px solid #ff6b35;border-radius:50%;animation:spin 1s linear infinite}@media(max-width:1024px){.store-content{flex-direction:column}.store-sidebar{width:100%;border-right:none;border-bottom:1px solid #e1e1e1;padding:20px 0}.nav-sections{flex-direction:row;overflow-x:auto;gap:8px;padding:0 20px}.nav-item{white-space:nowrap;min-width:auto}}@media(max-width:768px){.header-content{flex-direction:column;gap:15px;text-align:center}.header-left{flex-direction:column;gap:10px}.store-main{padding:20px 15px}.stats-grid{grid-template-columns:1fr}.stat-card{flex-direction:column;text-align:center}.settings-grid,.analytics-grid,.marketing-grid{grid-template-columns:1fr}.payment-grid{flex-direction:column}.filter-tabs{flex-wrap:wrap}}.mikebuild{min-height:100vh;background:#f5f5f5;display:flex;flex-direction:column}.builder-header{background:#fff;border-bottom:2px solid #e1e1e1;box-shadow:0 2px 10px #00000014;z-index:100}.builder-header .header-content{padding:15px 25px;display:flex;justify-content:space-between;align-items:center;max-width:none;margin:0}.builder-header .header-left{display:flex;align-items:center;gap:20px}.builder-header .back-button{background:#f8f9fa;color:#333;border:1px solid #e1e1e1;border-radius:6px;padding:8px 16px;font-size:.9rem;cursor:pointer;transition:all .3s ease}.builder-header .back-button:hover{background:#e9ecef}.builder-header .store-info h1{color:#333;font-size:1.4rem;font-weight:700;margin:0 0 2px}.store-name{color:#666;font-size:.85rem}.store-url{margin-top:4px;display:flex;align-items:center;gap:8px}.url-label{color:#888;font-size:.75rem;font-weight:500}.store-url-link{color:#ff6b35;font-size:.75rem;text-decoration:none;font-weight:500;transition:color .3s ease}.store-url-link:hover{color:#f7931e;text-decoration:underline}.builder-header .header-right{display:flex;align-items:center;gap:15px}.preview-button,.save-button{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease}.save-button{background:#28a745}.preview-button:hover,.save-button:hover{transform:translateY(-1px);box-shadow:0 4px 10px #00000026}.builder-header .user-menu{display:flex;align-items:center;gap:12px}.builder-header .user-menu span{color:#666;font-size:.85rem}.builder-header .logout-button{background:#333;color:#fff;border:none;border-radius:4px;padding:6px 12px;font-size:.8rem;cursor:pointer;transition:background .3s ease}.builder-header .logout-button:hover{background:#555}.builder-content{display:flex;flex:1;overflow:hidden}.builder-sidebar{min-width:320px;width:auto;max-width:400px;flex-shrink:0;background:#fff;border-right:1px solid #e1e1e1;display:flex;flex-direction:column;box-shadow:2px 0 8px #0000000a}.sidebar-header{background:linear-gradient(135deg,#f8f9fa,#fff);padding:20px 24px;border-bottom:1px solid #e9ecef}.sidebar-header h3{color:#2c3e50;font-size:1.2rem;font-weight:700;margin:0;letter-spacing:-.02em}.sidebar-actions{padding:20px 24px;border-bottom:1px solid #f1f3f5}.add-section-button{width:100%;background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;border:none;border-radius:10px;padding:16px 20px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:10px;justify-content:center;box-shadow:0 3px 10px #ff6b3533}.add-section-button:hover{transform:translateY(-1px);box-shadow:0 6px 20px #ff6b3559}.button-icon{font-size:1.1rem;font-weight:700;background:#ffffff40;border-radius:4px;padding:2px 6px;line-height:1}.sidebar-content{padding:0;flex:1;overflow-y:auto;overflow-x:hidden;max-width:100%}.elements-placeholder{text-align:center;padding:40px 20px;color:#999;font-style:italic}.publish-button{background:#28a745;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:5px}.publish-button:hover:not(:disabled){background:#218838;transform:translateY(-1px)}.publish-button:disabled{background:#6c757d;cursor:not-allowed}.settings-button{background:#6c757d;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:5px;margin-right:10px}.settings-button:hover{background:#5a6268;transform:translateY(-1px)}.no-sections{text-align:center;padding:40px 24px;color:#6c757d}.empty-state-icon{font-size:3rem;margin-bottom:16px;opacity:.6}.no-sections h4{color:#495057;font-size:1.1rem;font-weight:600;margin:0 0 8px}.no-sections .help-text{color:#6c757d;font-size:.9rem;margin:0;line-height:1.4}.sections-list{padding:20px 0}.sections-header{padding:0 24px 12px;border-bottom:1px solid #f1f3f5;margin-bottom:16px}.sections-count{color:#6c757d;font-size:.85rem;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.section-item{display:flex;align-items:center;padding:16px 24px;margin:0;background:#fff;border-bottom:1px solid #f8f9fa;transition:all .2s ease;position:relative}.section-item:hover{background:#f8f9fa;transform:translate(2px)}.section-item:hover:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(135deg,#ff6b35,#f7931e)}.section-number{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:600;margin-right:14px;flex-shrink:0}.section-info{flex:1;min-width:0}.section-title{color:#2c3e50;font-size:.95rem;font-weight:600;margin-bottom:4px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.section-type{color:#6c757d;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.8px}.section-actions{display:flex;gap:6px;opacity:0;transition:opacity .2s ease;align-items:center}.section-item:hover .section-actions{opacity:1}.section-move-buttons{display:flex;flex-direction:column;gap:2px;margin-right:6px}.move-btn{background:#f8f9fa;border:1px solid #dee2e6;width:24px;height:20px;cursor:pointer;border-radius:3px;transition:all .2s ease;font-size:12px;font-weight:700;color:#495057;display:flex;align-items:center;justify-content:center;padding:0}.move-btn:hover:not(:disabled){background:#e9ecef;border-color:#adb5bd;color:#212529}.move-btn:disabled{background:#f8f9fa;border-color:#e9ecef;color:#ced4da;cursor:not-allowed;opacity:.5}.move-up-btn:hover:not(:disabled){background:#e3f2fd;border-color:#2196f3;color:#1976d2}.move-down-btn:hover:not(:disabled){background:#f3e5f5;border-color:#9c27b0;color:#7b1fa2}.edit-btn,.delete-btn{background:none;border:1px solid #e9ecef;padding:6px 12px;cursor:pointer;border-radius:5px;transition:all .2s ease;font-size:.8rem;font-weight:500;color:#495057}.edit-btn:hover{background:#e3f2fd;border-color:#2196f3;color:#1976d2}.delete-btn:hover{background:#ffebee;border-color:#f44336;color:#d32f2f}.sidebar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.builder-canvas{flex:1;min-width:0;display:flex;flex-direction:column;background:#f5f5f5;overflow:hidden}.canvas-container{flex:1;display:flex;flex-direction:column;margin:20px;background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001a;overflow:hidden}.canvas-header{background:#f8f9fa;padding:15px 25px;border-bottom:1px solid #e1e1e1;display:flex;justify-content:space-between;align-items:center}.canvas-info{display:flex;flex-direction:column;gap:8px}.canvas-title{color:#333;font-weight:600;font-size:1rem}.page-selector{display:flex;align-items:center;gap:10px}.page-selector label{color:#666;font-size:.85rem;font-weight:500;white-space:nowrap}.page-dropdown{background:#fff;color:#333;border:1px solid #e1e1e1;border-radius:6px;padding:4px 8px;font-size:.85rem;cursor:pointer;transition:all .3s ease;min-width:150px}.page-dropdown:focus{outline:none;border-color:#ff6b35;box-shadow:0 0 0 2px #ff6b351a}.page-dropdown:disabled{background:#f8f9fa;color:#999;cursor:not-allowed}.add-page-button{background:#ff6b35;color:#fff;border:none;border-radius:6px;padding:4px 12px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .3s ease;white-space:nowrap;display:flex;align-items:center;gap:4px}.add-page-button:hover:not(:disabled){background:#f7931e;transform:translateY(-1px)}.add-page-button:disabled{background:#ccc;cursor:not-allowed;transform:none}.canvas-size{color:#666;font-size:.85rem}.canvas-controls{display:flex;gap:8px}.canvas-control{background:#fff;color:#666;border:1px solid #e1e1e1;border-radius:6px;padding:6px 12px;font-size:.85rem;cursor:pointer;transition:all .3s ease}.canvas-control.active,.canvas-control:hover{background:#ff6b35;color:#fff;border-color:#ff6b35}.canvas-area{flex:1;padding:40px;display:flex;align-items:center;justify-content:center;background:linear-gradient(45deg,#f8f9fa 25%,transparent 25%),linear-gradient(-45deg,#f8f9fa 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f8f9fa 75%),linear-gradient(-45deg,transparent 75%,#f8f9fa 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px;min-height:500px;overflow:hidden;position:relative}.canvas-placeholder{background:#fff;border:2px dashed #ddd;border-radius:12px;padding:60px 40px;text-align:center;max-width:500px;width:100%;transition:all .3s ease}.canvas-placeholder:hover{border-color:#ff6b35;background:#fff8f6}.placeholder-content{display:flex;flex-direction:column;align-items:center;gap:15px}.placeholder-icon{font-size:4rem;margin-bottom:10px}.canvas-placeholder h2{color:#333;font-size:1.5rem;font-weight:600;margin:0}.canvas-placeholder p{color:#666;font-size:1rem;margin:0;line-height:1.5}.placeholder-hint{background:#f8f9fa;color:#888;padding:10px 20px;border-radius:20px;font-size:.85rem;border:1px solid #e1e1e1}.canvas-preview{width:100%;height:100%;background:#fff;border-radius:8px;box-shadow:0 2px 10px #0000001a;overflow:hidden}.preview-frame{width:100%;height:100%;border:none;background:#fff;border-radius:8px}.canvas-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#666}.loading-spinner{font-size:2rem;margin-bottom:15px;animation:spin 2s linear infinite}.loading-container,.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:20px;background:#f5f5f5}.spinner{width:50px;height:50px;border:4px solid #f3f3f3;border-top:4px solid #ff6b35;border-radius:50%;animation:spin 1s linear infinite}.error-container h2{color:#333;margin:0}.error-container p{color:#666;margin:0 0 20px}.error-container .back-button{background:#ff6b35;color:#fff;border:none;border-radius:8px;padding:12px 24px;font-size:1rem;cursor:pointer;transition:background .3s ease}.error-container .back-button:hover{background:#f7931e}@media(max-width:1024px){.builder-content{flex-direction:column}.builder-sidebar{width:100%;max-height:200px;border-right:none;border-bottom:2px solid #e1e1e1}.sidebar-content{padding:15px 25px}.add-section-button{max-width:250px;margin:0 auto 20px}.canvas-container{margin:15px}.canvas-area{padding:20px}}@media(max-width:768px){.builder-header .header-content{flex-direction:column;gap:15px;padding:15px}.builder-header .header-left{flex-direction:column;gap:10px;text-align:center}.canvas-header{flex-direction:column;gap:15px;text-align:center}.page-selector{justify-content:center}.page-dropdown{min-width:120px}.canvas-controls{justify-content:center}.canvas-placeholder{padding:40px 20px}.placeholder-icon{font-size:3rem}.canvas-placeholder h2{font-size:1.25rem}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal{background:#fff;border-radius:8px;box-shadow:0 10px 30px #0000004d;width:90%;max-width:500px;max-height:90vh;overflow:hidden;animation:slideIn .3s ease}@keyframes slideIn{0%{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{background:#ff6b35;color:#fff;padding:20px 25px;display:flex;justify-content:space-between;align-items:center}.modal-header h3{margin:0;font-size:1.2rem;font-weight:600}.modal-close{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background .3s ease}.modal-close:hover{background:#fff3}.modal-body{padding:25px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;color:#333;font-weight:500;font-size:.95rem}.form-input{width:100%;padding:12px 15px;border:2px solid #e1e1e1;border-radius:6px;font-size:1rem;transition:all .3s ease;box-sizing:border-box}.form-input:focus{outline:none;border-color:#ff6b35;box-shadow:0 0 0 3px #ff6b351a}.form-input:disabled{background:#f8f9fa;color:#999;cursor:not-allowed}.form-help{display:block;margin-top:5px;color:#666;font-size:.85rem}.modal-footer{background:#f8f9fa;padding:20px 25px;display:flex;gap:15px;justify-content:flex-end;border-top:1px solid #e1e1e1}.cancel-button{background:#f8f9fa;color:#666;border:1px solid #e1e1e1;border-radius:6px;padding:10px 20px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease}.cancel-button:hover:not(:disabled){background:#e9ecef;color:#333}.cancel-button:disabled{cursor:not-allowed;opacity:.6}.create-button{background:#ff6b35;color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease;min-width:120px}.create-button:hover:not(:disabled){background:#f7931e;transform:translateY(-1px)}.create-button:disabled{background:#ccc;cursor:not-allowed;transform:none}.settings-modal{max-width:600px}.settings-form{max-height:60vh;overflow-y:auto}.form-label{display:flex;align-items:center;gap:10px;margin-bottom:8px;color:#333;font-weight:500;font-size:.95rem}.form-label .optional{color:#888;font-size:.8rem;font-weight:400;margin-left:auto}.form-label input[type=checkbox]{margin:0 5px 0 0}.form-help a{color:#ff6b35;text-decoration:none}.form-help a:hover{text-decoration:underline}.settings-preview{background:#f8f9fa;border:1px solid #e1e1e1;border-radius:6px;padding:20px;margin-top:25px}.settings-preview h4{margin:0 0 15px;color:#333;font-size:1rem;font-weight:600}.settings-preview ul{margin:0;padding-left:20px;list-style:none}.settings-preview li{margin-bottom:8px;color:#555;font-size:.9rem;display:flex;align-items:center;gap:8px}.settings-preview li:before{content:"";width:4px;height:4px;background:#ff6b35;border-radius:50%}.save-button{background:#28a745;color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease;min-width:140px}.save-button:hover{background:#218838;transform:translateY(-1px)}.templates-modal{max-width:1400px;width:95%;height:90vh;display:flex;flex-direction:column}.template-categories{display:flex;gap:10px;margin-bottom:25px;flex-wrap:wrap}.category-button{background:#f8f9fa;border:2px solid #e1e1e1;border-radius:25px;padding:8px 16px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .3s ease;text-transform:capitalize}.category-button:hover{background:#e9ecef;border-color:#ff6b35}.category-button.active{background:#ff6b35;border-color:#ff6b35;color:#fff}.templates-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:25px;max-height:60vh;overflow-y:auto;padding:10px 5px}.template-card{background:#fff;border:2px solid #e1e1e1;border-radius:12px;overflow:hidden;transition:all .3s ease;box-shadow:0 4px 15px #00000014}.template-card:hover{transform:translateY(-5px);box-shadow:0 15px 35px #00000026;border-color:#ff6b35}.template-preview{height:200px;overflow:hidden;position:relative;background:#f8f9fa}.template-iframe{width:100%;height:400px;border:none;transform:scale(.5);transform-origin:top left;pointer-events:none}.template-info{padding:20px}.template-name{font-size:1.1rem;font-weight:600;margin:0 0 8px;color:#333}.template-description{font-size:.9rem;color:#666;margin:0 0 15px;line-height:1.4}.template-tags{display:flex;gap:6px;margin-bottom:15px;flex-wrap:wrap}.template-tag{background:#f8f9fa;color:#666;padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:500}.template-use-button{background:#28a745;color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease;width:100%}.template-use-button:hover{background:#218838;transform:translateY(-1px)}.templates-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;grid-column:1 / -1;padding:60px 20px;color:#666}.templates-loading .spinner-border{margin-bottom:15px}.no-templates{grid-column:1 / -1;text-align:center;padding:60px 20px;color:#666}@media(max-width:768px){.templates-modal{width:98%;height:95vh}.templates-grid{grid-template-columns:1fr;gap:15px}.category-button{font-size:.8rem;padding:6px 12px}}.creator-modal{max-width:1200px;width:95%;height:95vh;display:flex;flex-direction:column}.creator-form{max-height:70vh;overflow-y:auto;padding-right:5px}.form-row{display:grid;grid-template-columns:1fr 200px;gap:20px;margin-bottom:20px}.code-section{border:1px solid #e1e1e1;border-radius:8px;padding:20px;background:#f8f9fa;margin:20px 0}.form-textarea{width:100%;padding:12px 15px;border:2px solid #e1e1e1;border-radius:6px;font-size:.9rem;font-family:Consolas,Monaco,Courier New,monospace;resize:vertical;transition:all .3s ease}.form-textarea:focus{outline:none;border-color:#ff6b35;box-shadow:0 0 0 3px #ff6b351a}.code-textarea{background:#fff;line-height:1.4;tab-size:2}.creator-tips{background:#e3f2fd;border:1px solid #bbdefb;border-radius:8px;padding:20px;margin:20px 0}.creator-tips h4{color:#1976d2;margin:0 0 15px;font-size:1rem}.creator-tips ul{margin:0;padding-left:20px}.creator-tips li{margin-bottom:8px;color:#555;font-size:.9rem}.creator-tips code{background:#fff3cd;border:1px solid #ffeaa7;border-radius:4px;padding:2px 6px;font-size:.85rem;color:#856404}.template-preview{margin-top:25px;border:1px solid #e1e1e1;border-radius:8px;padding:20px;background:#fff}.template-preview h4{margin:0 0 15px;color:#333;font-size:1rem}.preview-container{border:2px solid #e1e1e1;border-radius:8px;overflow:hidden;background:#f8f9fa}.preview-iframe{width:100%;height:300px;border:none;background:#fff}.create-template-button{background:#17a2b8;color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease;min-width:160px}.create-template-button:hover{background:#138496;transform:translateY(-1px)}.preview-button{background:#6c757d;color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease;min-width:140px}.preview-button:hover:not(:disabled){background:#5a6268;transform:translateY(-1px)}.preview-button:disabled{background:#ccc;cursor:not-allowed;transform:none}.save-template-button{background:#28a745;color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease;min-width:140px}.save-template-button:hover:not(:disabled){background:#218838;transform:translateY(-1px)}.save-template-button:disabled{background:#ccc;cursor:not-allowed;transform:none}@media(max-width:768px){.creator-modal{width:98%;height:98vh}.form-row{grid-template-columns:1fr;gap:10px}.creator-tips{padding:15px}.preview-iframe{height:200px}}@media(max-width:768px){.modal{width:95%;margin:10px}.modal-header,.modal-body,.modal-footer{padding:15px 20px}.modal-footer{flex-direction:column}.cancel-button,.create-button{width:100%;justify-content:center}}.section-modal{background:#fff;border-radius:8px;box-shadow:0 10px 30px #0000004d;width:95%;max-width:1200px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;animation:slideIn .3s ease}.section-modal-header{background:#ff6b35;color:#fff;padding:20px 25px;display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #f7931e}.section-modal-header h3{margin:0;font-size:1.3rem;font-weight:600}.section-modal-body{display:flex;flex:1;overflow:hidden}.section-sidebar{width:250px;background:#f8f9fa;border-right:1px solid #e1e1e1;overflow-y:auto}.section-tabs{display:flex;flex-direction:column;padding:0}.section-tab{background:none;border:none;padding:15px 20px;text-align:left;cursor:pointer;transition:all .3s ease;border-bottom:1px solid #e1e1e1;display:flex;align-items:center;gap:10px;font-size:.95rem;color:#666}.section-tab:hover{background:#e9ecef;color:#333}.section-tab.active{background:#ff6b35;color:#fff;font-weight:500}.tab-icon{font-size:1.2rem;width:24px;text-align:center}.section-content{flex:1;padding:25px;overflow-y:auto;background:#fff}.section-options h4{margin:0 0 20px;color:#333;font-size:1.1rem;font-weight:600}.section-templates{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.template-card{border:2px solid #e1e1e1;border-radius:8px;overflow:hidden;transition:all .3s ease;background:#fff;cursor:pointer}.template-card:hover{border-color:#ff6b35;transform:translateY(-2px);box-shadow:0 4px 20px #ff6b351a}.template-preview{padding:20px;background:#f8f9fa;min-height:120px;display:flex;align-items:center;justify-content:center;position:relative;font-size:.85rem}.navbar-preview{display:flex;justify-content:space-between;align-items:center;background:#fff;border-bottom:1px solid #e1e1e1;padding:10px 15px}.navbar-preview.dark{background:#333;color:#fff}.nav-brand{font-weight:700;color:#ff6b35}.navbar-preview.dark .nav-brand{color:#f7931e}.nav-links{display:flex;gap:15px}.nav-links span{font-size:.8rem;color:#666;cursor:pointer}.navbar-preview.dark .nav-links span{color:#ccc}.banner-preview{background:linear-gradient(135deg,#ff6b35,#f7931e);color:#fff;text-align:center;justify-content:center}.banner-preview.centered .banner-content{text-align:center}.banner-content h3{margin:0 0 8px;font-size:1rem}.banner-content p{margin:0 0 10px;font-size:.8rem;opacity:.9}.banner-content button{background:#fff;color:#ff6b35;border:none;padding:6px 12px;border-radius:4px;font-size:.75rem;cursor:pointer}.image-text-preview{display:flex;gap:15px;align-items:center;background:#fff;padding:15px}.image-text-preview.reverse{flex-direction:row-reverse}.image-placeholder{width:60px;height:60px;background:#e1e1e1;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:.7rem;color:#666;flex-shrink:0}.text-content h4{margin:0 0 5px;font-size:.9rem;color:#333}.text-content p{margin:0;font-size:.75rem;color:#666;line-height:1.3}.text-preview{background:#fff;padding:20px;text-align:left}.text-preview.centered{text-align:center}.text-preview h3{margin:0 0 10px;font-size:1rem;color:#333}.text-preview p{margin:0;font-size:.8rem;color:#666;line-height:1.4}.cards-preview{display:flex;gap:10px;background:#fff;padding:15px}.cards-preview.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.card-item{background:#f8f9fa;border:1px solid #e1e1e1;border-radius:4px;padding:15px 8px;text-align:center;font-size:.75rem;color:#666}.carousel-preview{background:#f8f9fa;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.carousel-item{background:#fff;border:1px solid #e1e1e1;border-radius:4px;padding:20px;text-align:center;font-size:.8rem;width:80%}.carousel-preview.testimonial .carousel-item{font-style:italic;color:#666}.carousel-dots{display:flex;gap:5px}.dot{width:8px;height:8px;background:#ccc;border-radius:50%}.dot.active{background:#ff6b35}.carousel-arrows{display:flex;gap:10px;font-size:1rem;color:#666}.carousel-arrows span{cursor:pointer;padding:5px;border-radius:4px;background:#e1e1e1}.product-preview{background:#fff;padding:15px}.product-preview:not(.grid){display:flex;flex-direction:column;align-items:center;text-align:center}.product-image{width:60px;height:60px;background:#e1e1e1;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:.7rem;color:#666;margin-bottom:10px}.product-info h5{margin:0 0 5px;font-size:.85rem;color:#333}.product-info p{margin:0 0 8px;font-size:.9rem;color:#ff6b35;font-weight:700}.product-info button{background:#ff6b35;color:#fff;border:none;padding:4px 12px;border-radius:4px;font-size:.75rem;cursor:pointer}.product-preview.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mini-product{background:#f8f9fa;border:1px solid #e1e1e1;border-radius:4px;padding:15px;text-align:center;font-size:.75rem;color:#666}.footer-preview{background:#333;color:#fff;padding:15px}.footer-preview.simple{background:#f8f9fa;color:#333;text-align:center}.footer-content{display:flex;justify-content:space-between;margin-bottom:10px}.footer-content.centered{flex-direction:column;text-align:center;gap:8px}.footer-section{font-size:.8rem;color:#ccc}.footer-preview.simple .footer-section{color:#666}.footer-bottom{font-size:.7rem;text-align:center;padding-top:10px;border-top:1px solid #555;color:#999}.social-links{font-size:1rem}.template-info{padding:15px}.template-info h5{margin:0 0 5px;font-size:.95rem;color:#333;font-weight:600}.template-info p{margin:0 0 12px;font-size:.85rem;color:#666;line-height:1.3}.template-select-btn{background:#ff6b35;color:#fff;border:none;padding:8px 16px;border-radius:4px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .3s ease;width:100%}.template-select-btn:hover{background:#f7931e}.section-modal-footer{background:#f8f9fa;padding:20px 25px;display:flex;gap:15px;justify-content:flex-end;border-top:1px solid #e1e1e1}.add-section-btn{background:#ff6b35;color:#fff;border:none;border-radius:6px;padding:10px 20px;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease;min-width:120px}.add-section-btn:hover{background:#f7931e;transform:translateY(-1px)}@media(max-width:768px){.section-modal{width:98%;max-height:95vh}.section-modal-body{flex-direction:column}.section-sidebar{width:100%;max-height:200px;overflow-x:auto}.section-tabs{flex-direction:row;white-space:nowrap}.section-tab{min-width:120px;border-bottom:none;border-right:1px solid #e1e1e1}.section-content{padding:15px}.section-templates{grid-template-columns:1fr;gap:15px}.section-modal-footer{flex-direction:column;gap:10px}.cancel-button,.add-section-btn{width:100%}}.no-sections{text-align:center;padding:40px 20px;color:#666}.no-sections p{margin:0 0 10px}.help-text{font-size:.85rem;color:#999}.sections-list{padding:0}.section-item{background:#fff;border:1px solid #e1e1e1;border-radius:6px;margin-bottom:10px;padding:12px;display:flex;justify-content:space-between;align-items:center;transition:all .3s ease}.section-item:hover{border-color:#ff6b35;box-shadow:0 2px 8px #ff6b351a}.section-info{display:flex;align-items:center;gap:12px;flex:1}.section-number{background:#ff6b35;color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;flex-shrink:0}.section-details h4{margin:0 0 2px;font-size:.9rem;color:#333;font-weight:500}.section-type{font-size:.75rem;color:#666;background:#f8f9fa;padding:2px 6px;border-radius:3px}.section-actions{display:flex;gap:5px}.edit-btn,.delete-btn{background:none;border:none;padding:4px;border-radius:4px;cursor:pointer;font-size:.9rem;transition:all .3s ease}.edit-btn:hover{background:#e3f2fd}.delete-btn:hover{background:#ffebee}.preview-frame{width:100%;height:100%;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 10px #0000001a;position:relative}.preview-iframe{width:100%;height:100%;border:none;background:#fff;transform:scale(.9);transform-origin:top center;overflow:hidden}.publish-button{background:#4caf50;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:5px}.publish-button:hover:not(:disabled){background:#45a049;transform:translateY(-1px)}.publish-button:disabled{background:#ccc;cursor:not-allowed;transform:none}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:20px}.loading-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #ff6b35;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:20px;text-align:center}.error-container h2{color:#ff6b35;margin:0}.error-container p{color:#666;margin:0}.create-page-btn{background:#ff6b35;color:#fff;border:none;border-radius:6px;padding:12px 24px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .3s ease;margin-top:20px}.create-page-btn:hover{background:#f7931e;transform:translateY(-2px)}.welcome-message{background:#f0f8ff;border:1px solid #b3d9ff;border-radius:6px;padding:15px;margin-top:15px}.welcome-message p{margin:0;color:#06c;font-size:.9rem}@media(max-width:768px){.section-item{flex-direction:column;align-items:flex-start;gap:10px}.section-info{width:100%}.section-actions{align-self:flex-end}.publish-button{padding:6px 12px;font-size:.85rem}.preview-frame{margin:10px;height:calc(100% - 20px)}}.section-modal{max-width:800px!important;width:90vw!important;max-height:90vh!important;display:flex!important;flex-direction:column!important}.section-modal .modal-body{overflow-y:auto!important;max-height:calc(90vh - 140px)!important;padding:20px 24px!important}.section-modal .modal-header{flex-shrink:0!important}.section-modal .modal-footer{flex-shrink:0!important;border-top:1px solid #f1f3f5!important;margin-top:0!important}.section-types-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-top:20px}.section-type-card{background:#fff;border:2px solid #f1f3f5;border-radius:12px;padding:24px;text-align:center;transition:all .3s ease;cursor:pointer;position:relative;overflow:hidden}.section-type-card:hover{border-color:#ff6b35;transform:translateY(-2px);box-shadow:0 8px 25px #ff6b3526}.section-type-card:active{transform:translateY(0)}.section-icon{font-size:2.5rem;margin-bottom:16px;display:block}.section-name{color:#2c3e50;font-size:1.1rem;font-weight:600;margin:0 0 8px}.section-description{color:#6c757d;font-size:.9rem;line-height:1.4;margin:0}.section-loading{position:absolute;inset:0;background:#ffffffe6;display:flex;align-items:center;justify-content:center;font-weight:600;color:#ff6b35}.modal-description{color:#6c757d;font-size:.95rem;margin:0;text-align:center}.add-section-button:disabled{opacity:.6;cursor:not-allowed;transform:none!important}.add-section-button:disabled:hover{box-shadow:0 3px 10px #ff6b3533!important}.section-editor{height:100%;display:flex;flex-direction:column}.close-editor-btn{background:#f8f9fa;color:#495057;border:1px solid #dee2e6;border-radius:6px;padding:8px 16px;font-size:.9rem;cursor:pointer;transition:all .2s ease}.close-editor-btn:hover{background:#e9ecef;color:#212529}.editor-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:0 0 20px;max-width:100%}.editor-section{padding:20px 24px;border-bottom:1px solid #f1f3f5;max-width:100%;box-sizing:border-box}.editor-section h4{color:#2c3e50;font-size:1rem;font-weight:600;margin:0 0 16px}.editor-section h5{color:#495057;font-size:.9rem;font-weight:500;margin:0 0 8px}.template-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;padding:12px 20px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease;width:100%}.template-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.color-input-group{display:flex;gap:10px;align-items:center}.color-picker{width:40px;height:40px;border:none;border-radius:8px;cursor:pointer;background:none}.hex-input{flex:1;padding:10px 12px;border:1px solid #dee2e6;border-radius:6px;font-size:.9rem;font-family:Courier New,monospace}.text-component{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;padding:16px;margin-bottom:16px}.text-editor{width:100%;padding:10px 12px;border:1px solid #dee2e6;border-radius:6px;font-size:.9rem;margin-bottom:12px;resize:vertical;min-height:60px}.text-controls{display:flex;gap:16px;flex-wrap:wrap}.control-group{display:flex;flex-direction:column;gap:6px;min-width:120px}.control-group label{font-size:.8rem;font-weight:500;color:#6c757d;text-transform:uppercase;letter-spacing:.5px}.number-input{padding:8px 10px;border:1px solid #dee2e6;border-radius:4px;font-size:.9rem;width:80px}.select-input{padding:8px 10px;border:1px solid #dee2e6;border-radius:4px;font-size:.9rem;background:#fff}.text-input{width:100%;padding:10px 12px;border:1px solid #dee2e6;border-radius:6px;font-size:.9rem;margin-bottom:12px}.border-controls{display:flex;gap:16px;flex-wrap:wrap}.button-component{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;padding:16px;margin-bottom:16px}.button-colors{display:flex;gap:16px;margin:12px 0;flex-wrap:wrap}.add-button-btn{background:#28a745;color:#fff;border:none;border-radius:6px;padding:10px 16px;font-size:.9rem;cursor:pointer;transition:all .2s ease;width:100%}.add-button-btn:hover{background:#218838;transform:translateY(-1px)}.editor-actions{padding:20px 24px;border-top:1px solid #dee2e6;display:flex;gap:12px;margin-top:auto}.cancel-btn{flex:1;background:#f8f9fa;color:#495057;border:1px solid #dee2e6;border-radius:6px;padding:12px 20px;font-size:.9rem;cursor:pointer;transition:all .2s ease}.cancel-btn:hover{background:#e9ecef}.save-btn{flex:2;background:linear-gradient(135deg,#28a745,#20c997);color:#fff;border:none;border-radius:6px;padding:12px 20px;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .3s ease}.save-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #28a7454d}.element-tag{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:2px 6px;border-radius:4px;font-size:.7rem;font-weight:600;margin-right:8px}.no-text-elements{color:#6c757d;font-style:italic;text-align:center;padding:20px;background:#f8f9fa;border-radius:6px;margin:0}.section-title{display:flex;align-items:center;gap:8px;margin-bottom:16px}.section-icon{font-size:1.2rem}.element-count{background:#e9ecef;color:#495057;padding:2px 8px;border-radius:12px;font-size:.75rem;font-weight:500}.appearance-grid,.effects-grid{display:grid;gap:16px}.appearance-item,.effect-item{background:#f8f9fa;border-radius:8px;padding:16px}.modern-label{display:block;font-size:.85rem;font-weight:600;color:#495057;margin-bottom:8px}.color-picker-modern{display:flex;align-items:center;gap:10px;background:#fff;border:2px solid #e9ecef;border-radius:8px;padding:8px;cursor:pointer;transition:all .2s ease}.color-picker-modern:hover{border-color:#ff6b35}.color-preview{width:32px;height:32px;border-radius:6px;border:2px solid #fff;box-shadow:0 0 0 1px #0000001a;cursor:pointer}.color-input-hidden{display:none}.color-value{font-family:Courier New,monospace;font-size:.8rem;color:#6c757d;min-width:70px}.slider-container{display:flex;align-items:center;gap:12px;background:#fff;border:2px solid #e9ecef;border-radius:8px;padding:12px}.modern-slider{flex:1;-webkit-appearance:none;appearance:none;height:6px;border-radius:3px;background:#e9ecef;outline:none}.modern-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:linear-gradient(135deg,#ff6b35,#f7931e);cursor:pointer;box-shadow:0 2px 4px #0003}.modern-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:linear-gradient(135deg,#ff6b35,#f7931e);cursor:pointer;border:none;box-shadow:0 2px 4px #0003}.slider-value{font-weight:600;color:#495057;min-width:40px;text-align:right}.empty-state{text-align:center;padding:30px 20px;background:#f8f9fa;border-radius:12px;color:#6c757d}.empty-icon{font-size:2rem;display:block;margin-bottom:8px}.text-items-list{display:flex;flex-direction:column;gap:16px}.text-item-card{background:#fff;border:2px solid #f1f3f5;border-radius:12px;padding:16px;transition:all .2s ease}.text-item-card:hover{border-color:#ff6b35;box-shadow:0 4px 12px #ff6b351a}.text-item-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.text-type-badge{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:4px 8px;border-radius:6px;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.text-preview{color:#6c757d;font-size:.85rem;font-style:italic}.modern-textarea{width:100%;border:2px solid #e9ecef;border-radius:8px;padding:12px;font-size:.95rem;font-family:inherit;resize:vertical;transition:border-color .2s ease;margin-bottom:12px}.text-style-controls{display:flex;gap:16px;align-items:end}.style-control{display:flex;flex-direction:column;gap:6px}.control-label{font-size:.75rem;font-weight:600;color:#495057;text-transform:uppercase;letter-spacing:.5px}.size-control{display:flex;align-items:center;background:#fff;border:2px solid #e9ecef;border-radius:8px;overflow:hidden}.size-btn{background:#f8f9fa;border:none;padding:8px 12px;font-weight:600;cursor:pointer;transition:background-color .2s ease}.size-btn:hover{background:#e9ecef}.size-display{padding:8px 12px;font-weight:600;color:#495057;min-width:60px;text-align:center;background:#fff}.modern-select,.modern-input{border:2px solid #e9ecef;border-radius:8px;padding:10px 12px;font-size:.9rem;transition:border-color .2s ease;background:#fff}.modern-select:focus,.modern-input:focus{outline:none;border-color:#ff6b35;box-shadow:0 0 0 3px #ff6b351a}.buttons-list{display:flex;flex-direction:column;gap:16px;margin-bottom:16px}.button-item-card{background:#fff;border:2px solid #f1f3f5;border-radius:12px;padding:16px}.button-header{margin-bottom:16px}.button-number{background:linear-gradient(135deg,#28a745,#20c997);color:#fff;padding:4px 10px;border-radius:6px;font-size:.8rem;font-weight:600}.button-controls{display:flex;flex-direction:column;gap:12px}.button-control{display:flex;flex-direction:column;gap:6px}.button-colors-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.add-button-modern{background:linear-gradient(135deg,#28a745,#20c997);color:#fff;border:none;border-radius:10px;padding:12px 16px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px}.add-button-modern:hover{transform:translateY(-2px);box-shadow:0 6px 20px #28a7454d}.editor-actions-modern{display:flex;gap:12px;padding:24px;border-top:2px solid #f1f3f5;background:linear-gradient(135deg,#f8f9fa,#fff);margin-top:auto;border-radius:0 0 12px 12px}.cancel-btn-modern{flex:1;background:#f8f9fa;color:#495057;border:2px solid #dee2e6;border-radius:10px;padding:14px 20px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}.cancel-btn-modern:hover{background:#e9ecef;transform:translateY(-1px)}.save-btn-modern{flex:2;background:linear-gradient(135deg,#28a745,#20c997);color:#fff;border:none;border-radius:10px;padding:14px 20px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px}.save-btn-modern:hover{transform:translateY(-2px);box-shadow:0 6px 20px #28a7454d}.btn-icon{font-size:.9rem}.layout-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-top:15px}.layout-item{display:flex;flex-direction:column;gap:8px}.layout-item .modern-label{font-size:.85rem;font-weight:600;color:#495057;margin-bottom:5px}.layout-item .modern-input{padding:12px 16px;border:2px solid #e9ecef;border-radius:8px;background:#fff;color:#495057;font-size:.9rem;transition:all .2s ease}.layout-item .modern-input:focus{outline:none;border-color:#fd7e14;box-shadow:0 0 0 3px #fd7e141a}.layout-item .slider-container{display:flex;align-items:center;gap:12px}.layout-item .modern-slider{flex:1;height:6px;border-radius:3px;background:#e9ecef;outline:none;cursor:pointer}.layout-item .slider-value{font-size:.8rem;font-weight:600;color:#6c757d;min-width:60px;text-align:right}.layout-item .color-preview{width:40px;height:40px;border-radius:8px;cursor:pointer;border:3px solid #ffffff;box-shadow:0 2px 8px #0000001a;transition:transform .2s ease}.layout-item .color-preview:hover{transform:scale(1.1)}.layout-item .color-value{font-family:monospace;font-size:.8rem;color:#6c757d;text-transform:uppercase}.color-picker-custom{display:flex;align-items:center;gap:12px;padding:8px;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef}.color-preview-custom{width:32px;height:32px;border-radius:6px;cursor:pointer;border:2px solid #ffffff;box-shadow:0 2px 4px #0000001a;transition:all .2s ease;position:relative}.color-preview-custom:hover{transform:scale(1.05);box-shadow:0 4px 8px #00000026}.color-preview-custom:active{transform:scale(.95)}.color-input-custom{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.color-value-custom{font-family:Courier New,monospace;font-size:.75rem;color:#495057;text-transform:uppercase;background:#fff;padding:4px 8px;border-radius:4px;border:1px solid #dee2e6;min-width:70px;text-align:center}.border-controls,.shadow-controls{margin-top:25px;padding-top:20px;border-top:1px solid #e9ecef}.control-group-title{font-size:.9rem;font-weight:600;color:#495057;margin-bottom:15px;display:flex;align-items:center;gap:8px}.border-row,.shadow-row{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px}.border-width,.border-color,.shadow-prop{display:flex;flex-direction:column;gap:5px}.border-sides{margin-top:15px}.sides-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:8px}.side-checkbox{display:flex;align-items:center;gap:8px;cursor:pointer;padding:8px 12px;background:#f8f9fa;border-radius:6px;border:1px solid #dee2e6;transition:all .2s ease}.side-checkbox:hover{background:#e9ecef}.side-checkbox input[type=checkbox]{margin:0}.side-checkbox span{font-size:.85rem;color:#495057;font-weight:500}.toggle-switch{display:flex;align-items:center;gap:12px;cursor:pointer}.toggle-switch input[type=checkbox]{display:none}.toggle-slider{position:relative;width:44px;height:24px;background:#ccc;border-radius:12px;transition:.3s}.toggle-slider:before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.3s}.toggle-switch input:checked+.toggle-slider{background:#fd7e14}.toggle-switch input:checked+.toggle-slider:before{transform:translate(20px)}.toggle-label{font-size:.85rem;font-weight:500;color:#495057}.shadow-properties{margin-top:15px;padding:15px;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef}.shadow-prop .modern-slider{margin-bottom:5px}.auto-save-indicator{display:flex;align-items:center;gap:6px;background:#e8f5e8;color:#2d5016;padding:4px 8px;border-radius:4px;font-size:.75rem;font-weight:500;margin:8px 0;animation:fadeIn .3s ease}.auto-save-indicator .save-icon{font-size:.8rem}.auto-save-indicator .save-text{font-size:.75rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.dynamic-content-editor{display:flex;flex-direction:column;gap:20px;max-height:400px;overflow-y:auto;padding:5px}.content-field{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;padding:15px;transition:all .2s ease}.content-field:hover{border-color:#ff6b35;box-shadow:0 2px 8px #ff6b351a}.content-field .modern-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-weight:600;color:#495057;font-size:.9rem}.field-type-badge{font-size:.7rem;padding:2px 8px;border-radius:12px;color:#fff;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.modern-textarea{width:100%;padding:10px 12px;border:2px solid #e9ecef;border-radius:6px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:.9rem;line-height:1.4;resize:vertical;transition:border-color .2s ease}.modern-textarea:focus{outline:none;border-color:#ff6b35;box-shadow:0 0 0 3px #ff6b351a}.size-input-group{display:flex;flex-direction:column;gap:4px}.size-input{flex:1}.size-hint{font-size:.75rem;color:#6c757d;font-style:italic}.color-picker-custom{display:flex;align-items:center;gap:10px}.color-preview-custom{width:40px;height:40px;border-radius:6px;border:2px solid #e9ecef;cursor:pointer;transition:all .2s ease}.color-preview-custom:hover{border-color:#ff6b35;transform:scale(1.05)}.color-input-custom{opacity:0;width:0;height:0;pointer-events:none}.no-content-detected{text-align:center;padding:40px 20px;color:#6c757d;background:#f8f9fa;border-radius:8px;border:2px dashed #e9ecef}.no-content-icon{font-size:2rem;margin-bottom:10px}.no-content-detected p{margin:0 0 8px;font-weight:500}.no-content-detected small{font-size:.8rem;opacity:.8}.content-field{animation:slideInUp .3s ease-out}@keyframes slideInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.dynamic-content-editor{max-height:300px;gap:15px}.content-field{padding:12px}.content-field .modern-label{font-size:.85rem;flex-direction:column;align-items:flex-start;gap:4px}.field-type-badge{align-self:flex-end}}.theme-admin{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;color:#fff}.spinner{width:50px;height:50px;border:4px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff;animation:spin 1s ease-in-out infinite;margin-bottom:1rem}@keyframes spin{to{transform:rotate(360deg)}}.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}.login-card{background:#fff;border-radius:16px;padding:2.5rem;box-shadow:0 20px 40px #0000001a;max-width:400px;width:100%}.logo{text-align:center;margin-bottom:2rem}.logo h1{color:#ff6b35;font-size:2rem;font-weight:700;margin:0}.logo p{color:#666;margin:.5rem 0 0;font-size:.9rem}.login-form h2{color:#333;margin-bottom:1.5rem;text-align:center}.form-group{margin-bottom:1.5rem}.form-group input{width:100%;padding:.75rem;border:2px solid #e1e5e9;border-radius:8px;font-size:1rem;transition:border-color .3s ease}.form-group input:focus{outline:none;border-color:#ff6b35}.login-button{width:100%;background:#ff6b35;color:#fff;border:none;padding:.75rem;font-size:1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:background-color .3s ease}.login-button:hover:not(:disabled){background:#e55a2b}.login-button:disabled{opacity:.6;cursor:not-allowed}.error-message{background:#fee;color:#c33;padding:.75rem;border-radius:8px;margin-bottom:1rem;font-size:.9rem;border:1px solid #fcc}.admin-header{background:#fff;border-bottom:1px solid #e1e5e9;padding:1rem 0}.header-content{max-width:1200px;margin:0 auto;padding:0 2rem;display:flex;align-items:center;justify-content:space-between}.header-left h1{color:#ff6b35;font-size:1.5rem;margin:0;font-weight:700}.admin-info{color:#666;font-size:.85rem;margin-left:1rem}.header-right{display:flex;gap:1rem;align-items:center}.create-theme-button{background:#ff6b35;color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-weight:500;transition:background-color .3s ease}.create-theme-button:hover{background:#e55a2b}.logout-button{background:#6c757d;color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-weight:500;transition:background-color .3s ease}.logout-button:hover{background:#5a6268}.admin-content{max-width:1200px;margin:0 auto;padding:2rem}.error-banner{background:#fee;color:#c33;padding:1rem;border-radius:8px;margin-bottom:2rem;border:1px solid #fcc}.create-theme-section{background:#fff;border-radius:12px;padding:2rem;margin-bottom:2rem;box-shadow:0 4px 6px #00000012}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem}.section-header h2{color:#333;margin:0;font-size:1.5rem}.header-buttons{display:flex;gap:1rem;align-items:center}.variables-button{background:#6f42c1;color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.85rem;font-weight:500;transition:background-color .3s ease}.variables-button:hover{background:#5a32a3}.example-button{background:#28a745;color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.85rem;font-weight:500;transition:background-color .3s ease}.example-button:hover{background:#218838}.theme-form{display:flex;flex-direction:column;gap:1.5rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-group label{display:block;margin-bottom:.5rem;color:#333;font-weight:500;font-size:.9rem}.form-group input,.form-group select,.form-group textarea{width:100%;padding:.75rem;border:2px solid #e1e5e9;border-radius:8px;font-size:.9rem;font-family:inherit;transition:border-color .3s ease}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#ff6b35}.code-sections{display:grid;gap:1.5rem}.code-section{display:flex;flex-direction:column}.code-textarea{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.85rem;line-height:1.5;resize:vertical;min-height:120px}.help-text{color:#666;font-size:.8rem;margin-top:.5rem;font-style:italic}.form-actions{display:flex;gap:1rem;justify-content:flex-end;padding-top:1rem;border-top:1px solid #e1e5e9}.cancel-button{background:#6c757d;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;cursor:pointer;font-weight:500;transition:background-color .3s ease}.cancel-button:hover{background:#5a6268}.create-button{background:#ff6b35;color:#fff;border:none;padding:.75rem 2rem;border-radius:8px;cursor:pointer;font-weight:500;transition:background-color .3s ease}.create-button:hover:not(:disabled){background:#e55a2b}.create-button:disabled{opacity:.6;cursor:not-allowed}.themes-list-section{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 4px 6px #00000012}.themes-list-section h2{color:#333;margin-bottom:1.5rem;font-size:1.5rem}.coming-soon{text-align:center;padding:3rem;color:#666}.coming-soon p{font-size:1.1rem;margin:0}@media(max-width:768px){.admin-content{padding:1rem}.header-content{padding:0 1rem;flex-direction:column;gap:1rem;text-align:center}.header-right{justify-content:center}.form-row{grid-template-columns:1fr}.login-card{padding:2rem}.form-actions{flex-direction:column}.create-theme-section{padding:1.5rem}.section-header{flex-direction:column;gap:1rem;text-align:center}.header-buttons{justify-content:center}}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:2rem}.modal-content{background:#fff;border-radius:16px;max-width:800px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 40px #0003}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem 2rem;border-bottom:1px solid #e1e5e9}.modal-header h3{color:#333;margin:0;font-size:1.4rem}.modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#666;padding:.25rem;border-radius:4px;transition:background-color .3s ease}.modal-close:hover{background:#f8f9fa;color:#333}.modal-body{padding:2rem}.variable-syntax{background:#f8f9fa;padding:1.5rem;border-radius:8px;margin-bottom:2rem}.variable-syntax h4{color:#333;margin:0 0 1rem;font-size:1.1rem}.variable-syntax code{background:#333;color:#ff6b35;padding:.5rem 1rem;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.9rem;display:block;margin-bottom:.5rem}.variable-syntax p{margin:0;color:#666;font-size:.9rem}.variable-types h4{color:#333;margin:0 0 1.5rem;font-size:1.1rem}.variable-type{background:#fff;border:2px solid #e1e5e9;border-radius:8px;padding:1.5rem;margin-bottom:1rem;transition:border-color .3s ease}.variable-type:hover{border-color:#ff6b35}.variable-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.variable-type-name{background:#ff6b35;color:#fff;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:600;text-transform:uppercase}.variable-description{color:#333;font-weight:500}.variable-example{margin-bottom:1rem}.variable-example strong,.variable-usage strong{color:#333;font-size:.9rem;display:block;margin-bottom:.5rem}.variable-example code{background:#f8f9fa;color:#6f42c1;padding:.5rem;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.8rem;display:block;word-wrap:break-word;border-left:3px solid #6f42c1}.variable-usage{color:#666;font-size:.9rem;line-height:1.5}.variable-tips{background:#e8f5e8;padding:1.5rem;border-radius:8px;margin-top:2rem}.variable-tips h4{color:#2d5016;margin:0 0 1rem;font-size:1.1rem}.variable-tips ul{margin:0;padding-left:1.5rem;color:#2d5016}.variable-tips li{margin-bottom:.5rem;line-height:1.5}.modal-footer{padding:1.5rem 2rem;border-top:1px solid #e1e5e9;display:flex;justify-content:flex-end}.modal-close-button{background:#6c757d;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;cursor:pointer;font-weight:500;transition:background-color .3s ease}.modal-close-button:hover{background:#5a6268}@media(max-width:768px){.modal-overlay{padding:1rem}.modal-content{max-height:95vh}.modal-header,.modal-body,.modal-footer{padding:1rem 1.5rem}.variable-type{padding:1rem}.variable-header{flex-direction:column;align-items:flex-start;gap:.5rem}}.App{min-height:100vh;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}:root{--primary-orange: #ff6b35;--secondary-orange: #f7931e;--black: #333333;--white: #ffffff;--light-gray: #f8f9fa;--border-gray: #e1e1e1;--text-gray: #666666;--error-red: #cc3333;--error-bg: #ffeeee}