white-label-insurance-library/dist/style.css

A reusable white-label insurance application component library.

.welcome-container{text-align:center;padding:50px}button{background-color:#0072c6;color:#fff;padding:10px 20px;border:none;font-size:16px;cursor:pointer}.questions-container{max-width:500px;margin:40px auto;padding:20px;border:2px solid;border-radius:10px;background-color:#fff}h2{font-size:24px;margin-bottom:20px}.brand-logo{display:block;margin:0 auto 20px;max-width:100%}form{display:flex;flex-direction:column}label{margin-bottom:15px;font-weight:700}input,select{padding:8px;margin-top:5px;font-size:16px}button{margin-top:20px;padding:10px;color:#fff;border:none;font-size:16px;cursor:pointer;border-radius:5px}.progress-container{display:flex;align-items:center;justify-content:center;margin-bottom:30px;position:relative}.progress-step{background-color:#ccc;color:#fff;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-weight:700;z-index:1;transition:background-color .3s ease}.progress-step.active{background-color:var(--brand-primary)}.progress-line{height:4px;background-color:#ccc;flex-grow:1;margin:0 10px;position:relative;top:-1px;transition:background-color .3s ease}.progress-line.active{background-color:var(--brand-primary)}.confirmation-container{max-width:700px;margin:40px auto;padding:40px;border:2px solid;border-radius:12px;background-color:#fff;box-shadow:0 6px 18px #00000026;display:flex;flex-direction:column;align-items:center;text-align:center}.confirmation-container h2{margin-bottom:20px;font-size:2.2em}.confirmation-container p{margin-bottom:30px;font-size:1.15em;line-height:1.6}.confirmation-container .brand-logo{width:180px;height:auto;margin-bottom:30px}.summary-section{width:90%;padding:25px;border-top:1px dashed #ccc;margin-top:30px;text-align:left;background-color:#f9f9f9;border-radius:8px;box-shadow:inset 0 0 8px #0000000d}.summary-section h3{font-size:1.6em;margin-bottom:20px;text-align:center;color:var(--brand-primary)}.summary-section h4{font-size:1.3em;margin-top:25px;margin-bottom:12px;color:var(--brand-secondary);border-bottom:1px solid rgba(0,0,0,.1);padding-bottom:5px}.data-list{list-style:none;padding:0;margin:0}.data-list li{margin-bottom:10px;font-size:1.05em;line-height:1.5;display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;padding:5px 0}.data-list li strong{display:inline-block;min-width:200px;font-weight:600;color:#333;text-align:left;margin-right:15px;flex-shrink:0}.data-list li span{flex-grow:1;text-align:right;color:#555}.confirmation-container button{background-color:var(--brand-button-color);color:var(--brand-button-text-color);padding:15px 35px;border:none;border-radius:8px;font-size:1.2em;cursor:pointer;font-family:var(--brand-font-family);font-weight:var(--brand-font-weight);margin-top:40px;box-shadow:0 6px 12px #0003;transition:background-color .3s ease,transform .2s ease,box-shadow .3s ease}.confirmation-container button:hover{transform:translateY(-3px);box-shadow:0 8px 16px #0000004d}