:root{--color-bg-primary: #f8f8f8;--color-bg-secondary: #ffffff;--color-text-primary: #2d3748;--color-text-secondary: #4a5568;--color-accent-yellow: #fdcf3c;--color-accent-green: #38a169;--color-accent-purple: #6b46c1;--color-accent-orange: #dd6b20;--shadow-default: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06)}body{background:linear-gradient(142deg,#f8f8f8,#f2f0e2);margin:0;color:var(--color-text-primary);line-height:1.6}.radio-pill-group{display:flex;flex-wrap:wrap;gap:10px}.radio-pill{position:relative;cursor:pointer;-webkit-user-select:none;user-select:none}.radio-pill input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.radio-pill-label{display:inline-block;padding:8px 16px;background-color:#f1f5f9;border-radius:20px;transition:all .3s ease;border:2px solid transparent;font-size:14px}.radio-pill input:checked+.radio-pill-label{background-color:var(--color-text-primary);color:var(--color-bg-primary);border-color:var(--color-accent-yellow);box-shadow:0 4px 6px -1px #3182ce33}.radio-pill-label:hover{border-color:var(--color-text-primary)}.radio-pill input:checked+.radio-pill-label:hover{background-color:var(--color-text-primary)}#calculateur{max-width:800px;margin:20px auto;background-color:var(--color-bg-secondary);border-radius:16px;padding:30px;box-shadow:var(--shadow-default)}#calculateur h2{text-align:center;margin-bottom:20px}.grid-container{display:grid;grid-template-columns:1fr 1fr;gap:20px}.section{background-color:#f8f9fa;border-radius:12px;padding:15px;box-shadow:var(--shadow-default)}.section:nth-child(1){background-color:#3182ce1a}.section:nth-child(2){background-color:#38a1691a}.section:nth-child(3){background-color:#6b46c11a}.section:nth-child(4){background-color:#dd6b201a}.section-title{font-weight:600;color:var(--color-text-secondary);margin-bottom:10px}input[type=number],input[type=radio]{margin:5px 0}input[type=number]{width:100%;padding:8px;border:1px solid #cbd5e0;border-radius:8px;transition:all .3s ease}input[type=number]:focus{outline:none;border-color:var(--color-accent-blue);box-shadow:0 0 0 3px #3182ce33}#btnCalculer{display:block;width:200px;margin:20px auto;padding:12px;background-color:var(--color-text-primary);color:#fff;border:none;border-radius:8px;cursor:pointer;transition:background-color .3s ease}#btnCalculer:hover{background-color:var(--color-text-secondary)}#resultats{background-color:#f1f5f9;border-radius:12px;padding:20px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-areas:"titre titre titre" "base booster arome" "maturation maturation maturation";gap:15px}.resultats-titre{grid-area:titre;text-align:center;width:100%;margin:0 0 20px}.result-text{font-weight:700;display:block;margin-bottom:5px;color:var(--color-text-secondary)}.result-value{font-size:1.2em;color:var(--color-text-primary)}#volumeBase,#volumeBooster,#volumeArome{position:relative;background-color:#fff;padding:40px 12px 12px;border-radius:8px;margin:0;box-shadow:var(--shadow-default);text-align:center}#volumeBase{grid-area:base}#volumeBooster{grid-area:booster}#volumeArome{grid-area:arome}#maturationTime{grid-area:maturation;background-color:#fff;padding:12px;border-radius:8px;margin:0;box-shadow:var(--shadow-default);text-align:center}.result-image{position:absolute;top:-15px;left:50%;transform:translate(-50%);width:50px;height:50px;object-fit:contain;background-color:#fff;border-radius:50%;padding:5px;box-shadow:var(--shadow-default);z-index:1;border:3px solid #f1f5f9}input:invalid{border-color:red;box-shadow:0 0 5px #ff000080}.section{transition:transform .3s ease,box-shadow .3s ease}.section:hover{transform:translateY(-2px);box-shadow:0 6px 12px -2px #00000026}#resultats{opacity:0;visibility:hidden;transition:opacity .5s ease,visibility .5s ease}#resultats.visible{opacity:1;visibility:visible;animation:fadeIn .5s ease forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}#btnCalculer{position:relative;overflow:hidden}#btnCalculer:after{content:"";position:absolute;top:50%;left:50%;width:5px;height:5px;background:#ffffff80;opacity:0;border-radius:100%;transform:scale(1) translate(-50%);transform-origin:50% 50%}#btnCalculer:focus:not(:active):after{animation:ripple 1s ease-out}@keyframes ripple{0%{transform:scale(0);opacity:.5}to{transform:scale(30);opacity:0}}@media(max-width:768px){.grid-container{grid-template-columns:1fr}.section{transform:translate(-20px);opacity:0;animation:slideIn .5s ease forwards}.section:nth-child(1){animation-delay:.1s}.section:nth-child(2){animation-delay:.2s}.section:nth-child(3){animation-delay:.3s}.section:nth-child(4){animation-delay:.4s}@keyframes slideIn{to{transform:translate(0);opacity:1}}}@media(max-width:600px){#resultats{grid-template-columns:1fr;grid-template-areas:"titre" "base" "booster" "arome" "maturation"}.resultats-titre{margin:0 0 15px}}.visible{visibility:visible!important}
/*# sourceMappingURL=/cdn/shop/t/12/assets/calculator.css.map */