smartwizard/dist/css/smartwizard.min.css

A modern and accessible step wizard plugin for jQuery

/*! jQuery SmartWizard v7
 * A modern, accessible step wizard plugin for jQuery
 * http://www.techlaboratory.net/jquery-smartwizard
 *
 * Created by Dipu Raj (https://github.com/techlab)
 *
 * Licensed under the terms of the MIT License - Free for personal and open-source projects.
 * For commercial use, please purchase a commercial license: https://techlaboratory.net/jquery-smartwizard#license
 */.sw *,.sw :after,.sw :before{box-sizing:border-box;margin:0;padding:0}:root{--sw-border-color:#eee;--sw-surface:#fff;--sw-border:#e0e0e0;--sw-shadow:0 2px 10px rgba(0,0,0,.08);--sw-radius:8px;--sw-content-pad:8px;--sw-content-bg:var(--sw-surface);--sw-content-text:#333;--sw-accent:#2196f3;--sw-accent-dark:#1565c0;--sw-accent-light:#64b5f6;--sw-accent-text:#fff;--sw-btn-primary-bg:var(--sw-accent);--sw-btn-primary-text:var(--sw-accent-text);--sw-btn-secondary-bg:#eee;--sw-btn-secondary-text:#333;--sw-transition:0.25s cubic-bezier(0.4,0,0.2,1);--sw-loader-color:#009ef7;--sw-loader-background-color:#f8f9fa;--sw-loader-background-wrapper-color:hsla(0,0%,100%,.7);--sw-progress-color:#009ef7;--sw-progress-background-color:#f8f9fa;--sw-connector-width:60px;--sw-connector-height:2px;--sw-connector-color:var(--sw-inactive-border);--sw-toolbar-btn-color:#fff;--sw-toolbar-btn-background-color:#009ef7;--sw-nav-badge-size:32px;--sw-nav-badge-radius:50%;--sw-nav-default-text:#9e9e9e;--sw-nav-default-bg:#eee;--sw-nav-default-badge-text:#999;--sw-nav-default-badge-bg:#ddd;--sw-nav-active-text:#fff;--sw-nav-active-bg:#2196f3;--sw-nav-active-badge-text:#2196f3;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-text:#eee;--sw-nav-completed-bg:#59b0f6;--sw-nav-completed-badge-text:#59b0f6;--sw-nav-completed-badge-bg:#eee;--sw-nav-error-text:#fff;--sw-nav-error-bg:#f44336;--sw-nav-error-badge-text:#f44336;--sw-nav-error-badge-bg:#ddd;--sw-nav-warning-text:#fff;--sw-nav-warning-bg:#ff9800;--sw-nav-warning-badge-text:#ff9800;--sw-nav-warning-badge-bg:#ddd}[data-theme=dark]{--sw-border-color:#2e2e2e;--sw-surface:#181818;--sw-border:#2e2e2e;--sw-shadow:0 2px 14px rgba(0,0,0,.6);--sw-content-bg:#1e1e1e;--sw-content-text:#d8d8d8;--sw-accent:#42a5f5;--sw-accent-dark:#1e88e5;--sw-accent-light:#64b5f6;--sw-accent-text:#fff;--sw-loader-color:#42a5f5;--sw-loader-background-color:#1e1e1e;--sw-loader-background-wrapper-color:hsla(0,0%,9%,.7);--sw-progress-color:#42a5f5;--sw-progress-background-color:#2a2a2a;--sw-connector-color:#3a3a3a;--sw-toolbar-btn-color:#fff;--sw-toolbar-btn-background-color:#1e88e5;--sw-btn-primary-bg:var(--sw-accent);--sw-btn-primary-text:var(--sw-accent-text);--sw-btn-secondary-bg:#2a2a2a;--sw-btn-secondary-text:#d8d8d8;--sw-nav-default-text:#666;--sw-nav-default-bg:#2a2a2a;--sw-nav-default-badge-text:#777;--sw-nav-default-badge-bg:#383838;--sw-nav-active-text:#fff;--sw-nav-active-bg:#1e88e5;--sw-nav-active-badge-text:#1e88e5;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-text:#bbb;--sw-nav-completed-bg:#2d4a6b;--sw-nav-completed-badge-text:#64b5f6;--sw-nav-completed-badge-bg:#1e2e3e;--sw-nav-error-text:#fff;--sw-nav-error-bg:#c62828;--sw-nav-error-badge-text:#ef5350;--sw-nav-error-badge-bg:#2a1a1a;--sw-nav-warning-text:#fff;--sw-nav-warning-bg:#e65100;--sw-nav-warning-badge-text:#ffa726;--sw-nav-warning-badge-bg:#2a1f10}[data-color=ocean]{--sw-accent:#0288d1;--sw-accent-dark:#01579b;--sw-accent-light:#4fc3f7;--sw-accent-text:#fff;--sw-loader-color:#0288d1;--sw-progress-color:#0288d1;--sw-toolbar-btn-background-color:#0288d1;--sw-nav-active-bg:#0288d1;--sw-nav-active-text:#fff;--sw-nav-active-badge-text:#0288d1;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-bg:#00897b;--sw-nav-completed-text:#fff;--sw-nav-completed-badge-text:#00897b;--sw-nav-completed-badge-bg:#e0f2f1}[data-color=forest]{--sw-accent:#388e3c;--sw-accent-dark:#1b5e20;--sw-accent-light:#66bb6a;--sw-accent-text:#fff;--sw-loader-color:#388e3c;--sw-progress-color:#388e3c;--sw-toolbar-btn-background-color:#388e3c;--sw-nav-active-bg:#558b2f;--sw-nav-active-text:#fff;--sw-nav-active-badge-text:#558b2f;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-bg:#4c6938;--sw-nav-completed-text:#fff;--sw-nav-completed-badge-text:#4c6938;--sw-nav-completed-badge-bg:#f1f8e9}[data-color=violet]{--sw-accent:#7b1fa2;--sw-accent-dark:#4a148c;--sw-accent-light:#9c27b0;--sw-accent-text:#fff;--sw-loader-color:#7b1fa2;--sw-progress-color:#7b1fa2;--sw-toolbar-btn-background-color:#7b1fa2;--sw-nav-active-bg:#7b1fa2;--sw-nav-active-text:#fff;--sw-nav-active-badge-text:#7b1fa2;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-bg:#6a1b9a;--sw-nav-completed-text:#fff;--sw-nav-completed-badge-text:#9c27b0;--sw-nav-completed-badge-bg:#f3e5f5}[data-color=crimson]{--sw-accent:#c2185b;--sw-accent-dark:#880e4f;--sw-accent-light:#e91e63;--sw-accent-text:#fff;--sw-loader-color:#c2185b;--sw-progress-color:#c2185b;--sw-toolbar-btn-background-color:#c2185b;--sw-nav-active-bg:#c2185b;--sw-nav-active-text:#fff;--sw-nav-active-badge-text:#c2185b;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-bg:#ad1457;--sw-nav-completed-text:#fff;--sw-nav-completed-badge-text:#e91e63;--sw-nav-completed-badge-bg:#fce4ec}[data-color=amber]{--sw-accent:#ffa000;--sw-accent-dark:#ff6f00;--sw-accent-light:#ffb300;--sw-accent-text:#fff;--sw-loader-color:#ffa000;--sw-progress-color:#ffa000;--sw-toolbar-btn-background-color:#ffa000;--sw-nav-active-bg:#ffa000;--sw-nav-active-text:#fff;--sw-nav-active-badge-text:#ffa000;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-bg:#f57c00;--sw-nav-completed-text:#fff;--sw-nav-completed-badge-text:#f57c00;--sw-nav-completed-badge-bg:#fff3e0}[data-color=indigo]{--sw-accent:#3949ab;--sw-accent-dark:#283593;--sw-accent-light:#5c6bc0;--sw-accent-text:#fff;--sw-loader-color:#3949ab;--sw-progress-color:#3949ab;--sw-toolbar-btn-background-color:#3949ab;--sw-nav-active-bg:#3949ab;--sw-nav-active-text:#fff;--sw-nav-active-badge-text:#3949ab;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-bg:#303f9f;--sw-nav-completed-text:#fff;--sw-nav-completed-badge-text:#5c6bc0;--sw-nav-completed-badge-bg:#e8eaf6}[data-color=slate]{--sw-accent:#1e40af;--sw-accent-dark:#1e3a8a;--sw-accent-light:#3b82f6;--sw-accent-text:#fff;--sw-loader-color:#1e40af;--sw-progress-color:#1e40af;--sw-toolbar-btn-background-color:#1e40af;--sw-nav-default-text:#4b5563;--sw-nav-default-bg:#f3f4f6;--sw-nav-default-badge-text:#1e3a5f;--sw-nav-default-badge-bg:#e0ecff;--sw-nav-active-bg:#1e40af;--sw-nav-active-text:#fff;--sw-nav-active-badge-text:#1e40af;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-bg:#15803d;--sw-nav-completed-text:#fff;--sw-nav-completed-badge-text:#15803d;--sw-nav-completed-badge-bg:#dcfce7;--sw-nav-error-bg:#b91c1c;--sw-nav-error-text:#fff;--sw-nav-error-badge-text:#b91c1c;--sw-nav-error-badge-bg:#fee2e2;--sw-nav-warning-bg:#92400e;--sw-nav-warning-text:#fff;--sw-nav-warning-badge-text:#713f12;--sw-nav-warning-badge-bg:#fef9c3}[data-color=teal]{--sw-accent:#0097a7;--sw-accent-dark:#006064;--sw-accent-light:#4dd0e1;--sw-accent-text:#fff;--sw-loader-color:#0097a7;--sw-progress-color:#0097a7;--sw-btn-primary-bg:linear-gradient(90deg,#00bcd4,#1f9ac7);--sw-btn-primary-text:#fff;--sw-nav-active-bg:linear-gradient(90deg,#017685,#1994c0);--sw-nav-active-text:#fff;--sw-nav-active-badge-text:#005b80;--sw-nav-active-badge-bg:#fff;--sw-nav-completed-bg:linear-gradient(90deg,#2195a7,#187e8e);--sw-nav-completed-text:#fff;--sw-nav-completed-badge-text:#005b80;--sw-nav-completed-badge-bg:#e0f7fa}.sw{background:var(--sw-surface);border:1px solid var(--sw-border);border-radius:var(--sw-radius);box-shadow:var(--sw-shadow);overflow:hidden;position:relative}.sw>.tab-content{background:var(--sw-content-bg);color:var(--sw-content-text);margin-top:1rem;min-height:140px;padding:var(--sw-content-pad);position:relative}.sw>.tab-content>.tab-pane{padding:.8rem}.sw .toolbar{align-items:center;background:var(--sw-surface);display:flex;gap:10px;justify-content:flex-end;padding:14px 24px}.sw .toolbar,.sw .toolbar-bottom{border-top:1px solid var(--sw-border)}.sw .toolbar-top{border-bottom:1px solid var(--sw-border);margin-bottom:-1rem}.sw .toolbar>.sw-btn{align-items:center;background:var(--sw-btn-primary-bg);border:none;border-radius:7px;box-shadow:0 1px 3px rgba(0,0,0,.12);color:var(--sw-btn-primary-text);cursor:pointer;display:inline-flex;gap:7px;padding:10px 22px;transition:all var(--sw-transition)}.sw .toolbar>.sw-btn:hover{background:var(--sw-accent-dark);box-shadow:0 2px 6px rgba(0,0,0,.16);transform:translateY(-1px)}.sw .toolbar>.sw-btn:active{transform:translateY(0)}.sw .toolbar>.sw-btn.disabled,.sw .toolbar>.sw-btn:disabled{opacity:.4;pointer-events:none}.sw .toolbar>.sw-btn svg{fill:currentColor;height:14px;width:14px}.sw .toolbar>.sw-btn-secondary{background:var(--sw-btn-secondary-bg);box-shadow:none;color:var(--sw-btn-secondary-text)}.sw .toolbar>.sw-btn-secondary:hover{background:color-mix(in srgb,var(--sw-btn-secondary-bg) 85%,var(--sw-accent) 15%)}.sw[dir=rtl]>.toolbar{text-align:left}.sw>.nav{-webkit-overflow-scrolling:touch;display:flex;flex-wrap:nowrap;gap:0;list-style:none;margin:0;overflow:hidden;padding:0;position:relative}.sw>.nav::-webkit-scrollbar{display:none}@media screen and (max-width:640px){.sw>.nav{flex:1 auto;flex-direction:column!important}}.sw>.nav.nav-scroll{-webkit-overflow-scrolling:touch;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none}.sw>.nav.nav-scroll::-webkit-scrollbar{display:none}.sw>.nav .nav-scroll-btn{align-items:center;background:var(--sw-surface);border:none;color:var(--sw-inactive-text);cursor:pointer;display:none;height:100%;justify-content:center;padding:0;position:absolute;top:0;transition:color var(--sw-transition),background var(--sw-transition);width:36px;z-index:10}.sw>.nav .nav-scroll-btn:hover{background-color:rgba(0,0,0,.1);color:var(--sw-accent)}.sw>.nav .nav-scroll-btn svg{height:16px;width:16px}.sw>.nav .nav-scroll-btn--prev{box-shadow:4px 0 10px -2px rgba(0,0,0,.12);left:0}.sw>.nav .nav-scroll-btn--next{box-shadow:-4px 0 10px -2px rgba(0,0,0,.12);right:0}.sw>.nav .nav-scroll-btn.nav-scroll-btn-visible{display:flex}.sw>.nav .nav-item{display:flex;position:relative;z-index:1}.sw>.nav .nav-link{align-items:center;background:var(--sw-nav-default-bg);color:var(--sw-nav-default-text);cursor:pointer;display:flex;gap:10px;padding:14px 20px;position:relative;transition:all .3s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.sw>.nav .nav-link,.sw>.nav .nav-link:active,.sw>.nav .nav-link:focus,.sw>.nav .nav-link:hover{text-decoration:none}.sw>.nav .nav-link::-moz-focus-inner{border:0}.sw>.nav .nav-link.active{background:var(--sw-nav-active-bg);color:var(--sw-nav-active-text);cursor:default;z-index:4}.sw>.nav .nav-link.active .badge{background:var(--sw-nav-active-badge-bg);color:var(--sw-nav-active-badge-text)}.sw>.nav .nav-link.completed{background:var(--sw-nav-completed-bg);color:var(--sw-nav-completed-text);z-index:2}.sw>.nav .nav-link.completed .badge{background:var(--sw-nav-completed-badge-bg);color:var(--sw-nav-completed-badge-text)}.sw>.nav .nav-link.error{background:var(--sw-nav-error-bg);color:var(--sw-nav-error-text);z-index:2}.sw>.nav .nav-link.error .badge{background:var(--sw-nav-error-badge-bg);color:var(--sw-nav-error-badge-text)}.sw>.nav .nav-link.warning{background:var(--sw-nav-warning-bg);color:var(--sw-nav-warning-text);z-index:2}.sw>.nav .nav-link.warning .badge{background:var(--sw-nav-warning-badge-bg);color:var(--sw-nav-warning-badge-text)}.sw>.nav .nav-link.hidden{display:none;visibility:none}.sw>.nav .nav-link.disabled,.sw>.nav .nav-link:disabled{cursor:not-allowed;opacity:.45;pointer-events:none}.sw>.nav .nav-link>.badge{align-items:center;background:var(--sw-nav-default-badge-bg);border-radius:var(--sw-nav-badge-radius);clear:both;color:var(--sw-nav-default-badge-text);display:flex;flex-shrink:0;height:var(--sw-nav-badge-size);justify-content:center;line-height:1;pointer-events:none;transition:background var(--sw-transition),transform var(--sw-transition);width:var(--sw-nav-badge-size)}.sw>.nav .nav-link:hover:not(.disabled) .badge{transform:scale(1.05)}.sw:focus>.nav>.nav-scroll-btn,.sw:hover>.nav>.nav-scroll-btn{opacity:1}.sw.sw-justified>.nav{justify-content:space-between}.sw[dir=rtl]>.nav .nav-link>.badge{float:right}.sw>.progress{background:var(--sw-inactive-bg);border:0;height:5px;margin:0;overflow:hidden;padding:0;width:100%}.sw>.progress>.progress-bar{background:linear-gradient(90deg,var(--sw-accent-dark),var(--sw-accent));box-shadow:0 0 8px var(--sw-accent-light);height:100%;transition:width var(--sw-transition);width:0}.sw.sw-loading{-webkit-user-select:none;-moz-user-select:none;user-select:none}.sw.sw-loading:after{background:var(--sw-loader-background-wrapper-color);content:"";display:block;height:100%;left:0;opacity:1;position:absolute;top:0;width:100%;z-index:99}.sw.sw-loading:before{animation:spin 1s linear infinite;border-radius:50%;border-top:10px solid var(--sw-loader-color);border:10px solid var(--sw-loader-color);border-top-color:var(--sw-loader-background-color);content:"";display:inline-block;height:2rem;left:45%;position:absolute;top:45%;width:2rem;z-index:10}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
/*# sourceMappingURL=smartwizard.min.css.map */