@import"./base-extensions.css";:root{--calc-font-main: clamp(1.4rem, 2.5vw + .5rem, 1.8rem);--calc-font-heading: clamp(1.6rem, 3vw + .75rem, 2.2rem);--calc-font-body: clamp(1.3rem, 1.8vw + .25rem, 1.5rem);--calc-font-small: clamp(1.1rem, 1.5vw + .25rem, 1.3rem);--calc-line-relaxed: 1.6;--calc-line-tight: 1.3;--calc-text-primary: var(--ext-color-text-heading);--calc-text-secondary: var(--ext-color-text-body);--calc-accent: var(--ext-color-adheseal-red);--calc-success: var(--ext-color-success);--calc-bg-subtle: var(--ext-color-surface-subtle)}.calculator-trigger{margin:var(--ext-space-lg) 0;text-align:center}.trigger-content{padding:var(--ext-space-xl);background:var(--calc-bg-subtle);border-radius:var(--border-radius);transition:var(--ext-transition-base);cursor:pointer}.trigger-content:hover{transform:translateY(-2px);box-shadow:var(--ext-shadow-certainty)}.trigger-content h4{font-family:var(--font-family-heading);font-size:var(--calc-font-heading);font-weight:var(--calc-weight-semibold);color:var(--calc-text-primary);margin:0 0 var(--ext-space-sm) 0;text-transform:uppercase;letter-spacing:.05em;line-height:var(--calc-line-tight)}.trigger-content p{color:var(--calc-text-secondary);margin:0 0 var(--ext-space-lg) 0;line-height:var(--calc-line-relaxed);font-size:var(--calc-font-body)}.calculator-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--ext-z-index-modal);display:flex;align-items:center;justify-content:center;background:#221f1fcc;opacity:0;transition:opacity var(--ext-transition-base)}.calculator-modal[style*="display: flex"]{opacity:1}.modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer}.modal-content{position:relative;width:min(95vw,600px);max-height:90vh;background:var(--ext-color-white);border-radius:var(--border-radius);box-shadow:var(--ext-shadow-expertise);overflow:hidden;transform:translateY(-20px) scale(.95);transition:transform var(--ext-transition-base);border:1px solid var(--ext-color-border-default)}.modal-content[style*="display: flex"]{transform:translateY(0) scale(1)}.modal-body{padding:var(--ext-space-lg);padding-top:calc(var(--ext-space-lg) + 60px);overflow-y:auto;max-height:calc(90vh - var(--ext-space-lg))}.modal-header{text-align:center;margin-bottom:var(--ext-space-lg);padding-bottom:var(--ext-space-md);border-bottom:1px solid var(--ext-color-border-default)}.modal-header h2{font-family:var(--font-family-heading);font-size:var(--calc-font-heading);font-weight:var(--calc-weight-bold);color:var(--calc-text-primary);margin:0;text-transform:uppercase;letter-spacing:.05em;line-height:var(--calc-line-tight)}.modal-close{position:absolute;top:var(--ext-space-md);right:var(--ext-space-md);width:40px;height:40px;background:transparent;border:none;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:var(--ext-transition-base);z-index:3}.modal-close:hover{background:var(--calc-accent);transform:scale(1.1)}.modal-close svg{width:20px;height:20px;stroke:var(--calc-text-secondary);transition:var(--ext-transition-base)}.modal-close:hover svg{stroke:var(--ext-color-white)}.calculator-info{margin-top:var(--ext-space-md)}.info-toggle{display:flex;align-items:center;gap:var(--ext-space-sm);background:none;border:none;cursor:pointer;padding:var(--ext-space-sm);color:var(--calc-text-secondary);font-size:var(--calc-font-small);transition:var(--ext-transition-base);width:100%;justify-content:center}.info-toggle:hover{color:var(--calc-text-primary)}.info-toggle svg{width:16px;height:16px;transition:transform var(--ext-transition-base)}.info-toggle[aria-expanded=true] .toggle-icon{transform:rotate(180deg)}.info-content{overflow:hidden;transition:max-height var(--ext-transition-base);background:var(--calc-bg-subtle);border-radius:var(--border-radius);margin-top:var(--ext-space-sm)}.info-section{padding:var(--ext-space-md);text-align:left}.info-section p{margin:0;font-size:var(--calc-font-small);line-height:var(--calc-line-relaxed);color:var(--calc-text-secondary)}.calculator-form,.form-sections{display:flex;flex-direction:column;gap:var(--ext-space-lg)}.form-section{background:var(--calc-bg-subtle);border-radius:var(--border-radius);padding:var(--ext-space-lg);border:1px solid var(--ext-color-border-default)}.section-title{font-family:var(--font-family-heading);font-size:var(--calc-font-main);font-weight:var(--calc-weight-semibold);color:var(--calc-text-primary);margin:0 0 var(--ext-space-md) 0;letter-spacing:.05em;line-height:var(--calc-line-tight);text-transform:uppercase}.form-grid{display:grid;grid-template-columns:1fr;gap:var(--ext-space-md)}@media (min-width: 768px){.form-grid{grid-template-columns:repeat(3,1fr)}}.form-group{display:flex;flex-direction:column}.form-label{font-family:var(--font-family-heading);font-size:var(--calc-font-small);font-weight:var(--calc-weight-medium);color:var(--calc-text-primary);margin-bottom:var(--ext-space-xs);line-height:var(--calc-line-relaxed)}.form-input{padding:var(--ext-space-sm);border:2px solid var(--ext-color-border-default);border-radius:var(--border-radius);font-family:var(--font-family-body);font-size:var(--calc-font-body);background:var(--ext-color-white);transition:var(--ext-transition-base);min-height:48px}.form-input:focus{outline:none;border-color:var(--calc-accent);box-shadow:0 0 0 3px #ea1f271a}.form-input::placeholder{color:var(--ext-color-neutral-400)}.form-input.invalid{border-color:#dc2626}.radio-group{display:flex;flex-direction:column;gap:var(--ext-space-sm)}@media (min-width: 768px){.radio-group{flex-direction:row}}.radio-option{display:flex;align-items:center;gap:var(--ext-space-sm);cursor:pointer;padding:var(--ext-space-md);border-radius:var(--border-radius);border:2px solid var(--ext-color-border-default);background:var(--ext-color-white);transition:var(--ext-transition-base);min-height:48px;flex:1}.radio-option:hover{border-color:var(--calc-accent);background:#ea1f2705}.radio-option input[type=radio]{width:18px;height:18px;accent-color:var(--calc-accent)}.radio-label{font-family:var(--font-family-body);font-size:var(--calc-font-body);color:var(--calc-text-secondary);cursor:pointer;display:flex;align-items:center;gap:var(--ext-space-sm);flex:1}.radio-option--custom .radio-label{justify-content:space-between}.form-input--small{width:120px;min-width:80px}.toggle-group{display:flex;align-items:center;justify-content:space-between;gap:var(--ext-space-md);padding:var(--ext-space-md);background:var(--ext-color-white);border-radius:var(--border-radius);border:2px solid var(--ext-color-border-default);margin-top:var(--ext-space-md)}@media (max-width: 767px){.toggle-group{flex-direction:column;text-align:center;gap:var(--ext-space-sm)}}.toggle-label{font-family:var(--font-family-heading);font-size:var(--calc-font-small);font-weight:var(--calc-weight-medium);color:var(--calc-text-primary);line-height:var(--calc-line-relaxed)}.switch{position:relative;width:60px;height:30px;background:var(--ext-color-neutral-300);border-radius:30px;transition:var(--ext-transition-base);cursor:pointer;flex-shrink:0}.switch input{opacity:0;width:0;height:0}.switch input:checked+.slider{background:var(--calc-success)}.switch input:checked+.slider:before{transform:translate(30px)}.slider{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--ext-color-neutral-300);border-radius:30px;transition:var(--ext-transition-base)}.slider:before{position:absolute;content:"";height:24px;width:24px;left:3px;bottom:3px;background:var(--ext-color-white);border-radius:50%;transition:var(--ext-transition-base);box-shadow:var(--ext-shadow-precision)}.calculate-btn{background:var(--calc-accent);color:var(--ext-color-white);border:none;padding:var(--ext-space-md) var(--ext-space-xl);border-radius:var(--border-radius);font-family:var(--font-family-heading);font-size:var(--calc-font-body);font-weight:600;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;transition:var(--ext-transition-base);align-self:center;min-width:200px;box-shadow:var(--ext-shadow-certainty);position:relative;overflow:hidden}.calculate-btn:hover{background:#d11a1f;transform:translateY(-2px);box-shadow:var(--ext-shadow-authority)}.calculate-btn:active{transform:translateY(0)}.calculate-btn:disabled{background:var(--ext-color-neutral-400);cursor:not-allowed;transform:none}.results-container{margin-top:var(--ext-space-lg);padding:var(--ext-space-lg);background:#00b1400d;border:2px solid var(--calc-success);border-radius:var(--border-radius);animation:slideInUp var(--ext-transition-base)}.results-header{text-align:center;margin-bottom:var(--ext-space-md)}.results-header h3{font-family:var(--font-family-heading);font-size:var(--calc-font-main);font-weight:var(--calc-weight-semibold);color:var(--calc-success);margin:0;letter-spacing:.05em;line-height:var(--calc-line-tight)}.results-content{display:flex;flex-direction:column;gap:var(--ext-space-sm);align-items:center;text-align:center}.result-text{color:var(--calc-text-secondary);font-weight:600;margin:0;line-height:var(--calc-line-relaxed);font-size:var(--calc-font-body)}.result-text--emphasis{color:var(--calc-accent);font-weight:700}@media (max-width: 768px){.modal-content{width:95%;max-height:95vh;border-radius:var(--border-radius)}.modal-body{padding:var(--ext-space-md);padding-top:calc(var(--ext-space-md) + 60px)}.form-section{padding:var(--ext-space-md)}.calculate-btn{width:100%;min-width:auto;font-size:var(--calc-font-small)}}@media (max-width: 480px){.modal-content{width:100%;height:100%;max-height:100vh;border-radius:0}.modal-body{padding:var(--ext-space-sm);padding-top:calc(var(--ext-space-sm) + 60px)}.trigger-content{padding:var(--ext-space-md)}.trigger-content h4{font-size:var(--calc-font-main)}}@media (min-width: 1200px){.modal-content{max-width:650px}}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-close:focus-visible,.form-input:focus,.radio-option:focus-within,.calculate-btn:focus-visible{outline:2px solid var(--calc-accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){.calculator-modal,.modal-content,.results-container,.calculate-btn,.trigger-content{animation:none;transition:none}}@media (prefers-contrast: high){.modal-content{border:2px solid var(--calc-text-primary)}.form-input,.radio-option,.toggle-group{border-width:2px}}@media print{.calculator-modal{position:static;display:block}.modal-backdrop,.modal-close,.trigger-content{display:none}}
/*# sourceMappingURL=/cdn/shop/t/25/assets/component-calculator-sealant.css.map */