.tile-calculator-container{max-width:600px;margin:30px auto;background:#f6f6f6;border-radius:0;padding:30px;border:1px solid #ddd}.tile-calculator-header{display:flex;align-items:center;margin-bottom:30px}.tile-calculator-header h2{font-size:24px;color:#333;margin-right:10px;margin-bottom:0}.info-icon{width:24px;height:24px;background-color:#ccc;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;font-weight:700;cursor:pointer;transition:background-color 0.3s ease}.info-icon:hover{background-color:#999}.calculator-section{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:10px;width:100%}.quantity-control{display:flex;align-items:center;background-color:#f8f8f8;overflow:hidden;width:75%;height:9vh}.quantity-btn{width:50px;height:9vh;background-color:#888;color:#fff;border:none;font-size:24px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color 0.3s ease}.quantity-btn:hover{background-color:#666}.quantity-btn:focus{outline:2px solid #0073aa;outline-offset:2px}.quantity-display{display:flex;flex-direction:column;align-items:center;gap:5px;background:#fff;padding:6px 20px;text-align:center;min-width:60px;min-height:9vh}.quantity-number{font-size:16px;padding:0;font-weight:700;color:#333;margin-bottom:px}.quantity-label{font-size:12px;color:#888}.area-display{text-align:center;padding:6px 20px;background:#fff;border:1px solid #ddd;min-width:120px;min-height:10vh}.area-number{font-size:16px;font-weight:700;color:#333;margin-bottom:5px}.area-label{font-size:12px;color:#888;line-height:1.1}.tile-calc-notification{position:fixed;top:20px;right:20px;padding:15px 20px;border-radius:4px;color:#fff;font-weight:700;z-index:10000;transform:translateX(100%);transition:transform 0.3s ease;max-width:300px;word-wrap:break-word}.tile-calc-notification.show{transform:translateX(0)}.tile-calc-notification-success{background-color:#4a7c59}.tile-calc-notification-error{background-color:#e74c3c}.area-input-field{color:#333!important;margin-bottom:0!important;width:80px;border:none!important;padding:2px 0!important;text-align:center;font-size:16px!important;font-weight:bold!important;background:white!important;transition:border-color 0.3s ease;-moz-appearance:textfield}.area-input-field::-webkit-outer-spin-button,.area-input-field::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.area-input-field[type=number]{-moz-appearance:textfield}.area-input-field:focus{outline:none;border-color:#007cba;box-shadow:0 0 0 1px #007cba}.area-input-field:hover{border-color:#999}.area-display{display:flex;flex-direction:column;align-items:center;gap:5px}.tile-calculator-btn{background:#fff;padding:7px 8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.3s ease;border:none;flex-direction:column}.tile-calculator-btn:hover{border-color:#aaa;box-shadow:0 2px 5px rgb(0 0 0 / .1)}.tile-calculator-btn:focus{outline:2px solid #0073aa;outline-offset:2px}.calculator-icon{width:24px;height:24px;margin-bottom:4px;background-color:#666;position:relative}.calculator-icon::before{content:"=";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:12px;font-weight:700}.add-to-cart-calc{width:100%;background-color:#000;color:#fff;border:none;padding:20px;font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color 0.3s ease}.add-to-cart-calc:hover{background-color:#6e7888}.add-to-cart-calc:focus{outline:2px solid #000;outline-offset:2px}.added_to_cart{width:100%;background-color:#000;color:white!important;border:none;padding:20px;font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-top:15px;transition:background-color 0.3s ease}.added_to_cart:hover{background-color:#6e7888}.added_to_cart:focus{outline:2px solid #000;outline-offset:2px}.cart-icon{margin-right:15px;font-size:20px}.footer-text{text-align:center;color:#666;font-size:16px}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:rgb(0 0 0 / .5)}.modal-content{background-color:#fff;margin:2% auto;padding:0;width:90%;max-width:1000px;max-height:90vh;overflow-y:auto;position:relative}.modal-header{padding:20px 30px;border-bottom:1px solid #eee;display:flex;justify-content:space-between;align-items:center}.modal-title{font-size:18px;color:#333;margin:0}.close{font-size:28px;font-weight:700;color:#aaa;cursor:pointer;line-height:1;padding:5px;transition:all 0.3s ease}.close:hover{color:#333;background-color:#f5f5f5}.close:focus{outline:2px solid #000;outline-offset:2px}.modal-body{padding:30px;display:grid;grid-template-columns:1fr 1fr;gap:30px}.calculator-left{display:flex;flex-direction:column}.calculator-right{display:flex;flex-direction:column}.area-section{margin-bottom:30px}.area-header{display:grid;grid-template-columns:80px 1fr 30px 1fr 50px 80px 30px;gap:15px;margin-bottom:20px;font-size:14px;color:#666;font-weight:700}.area-row{display:grid;grid-template-columns:80px 1fr 30px 1fr 50px 80px 30px;gap:15px;align-items:center;margin-bottom:15px}.area-input{padding:8px 12px;border:1px solid #ddd;font-size:14px;transition:border-color 0.3s ease}.area-input:focus{border-color:#6e7888;outline:none;box-shadow:0 0 0 1px #6e7888}.multiply-symbol{text-align:center;font-size:18px;color:#666}.equals-symbol{text-align:center;font-size:16px;color:#666}.area-result{padding:8px 12px;background-color:#f5f5f5;border:1px solid #ddd;font-size:14px;color:#666}.add-area-btn{display:flex;align-items:center;background:none;border:none;color:#e74c3c;cursor:pointer;font-size:14px;margin-top:10px;padding:5px;transition:background-color 0.3s ease}.add-area-btn:hover{background-color:#f8f8f8}.add-area-btn:focus{outline:2px solid #000;outline-offset:2px}.add-area-btn:before{content:'+';display:inline-block;width:20px;height:20px;background-color:#e74c3c;color:#fff;border-radius:50%;text-align:center;line-height:20px;margin-right:8px;font-size:12px}.delete-area-btn{background:none;border:none;cursor:pointer;color:#e74c3c;font-size:16px;padding:5px;display:flex;align-items:center;justify-content:center;transition:background-color 0.2s}.delete-area-btn:hover{background-color:#f8f8f8}.delete-area-btn:focus{outline:2px solid #000;outline-offset:2px}.delete-area-btn:before{content:'🗑️';font-size:14px}.room-diagram{background-color:#f5f5f5;padding:20px;text-align:center;margin-bottom:30px}.room-illustration{width:100%;max-width:300px;height:200px;background-color:#d4c5b9;position:relative;margin:0 auto 20px}.wall-label{position:absolute;font-size:12px;font-weight:700;color:#8b4513}.wall-top{top:-15px;left:50%;transform:translateX(-50%)}.wall-right{right:-25px;top:50%;transform:translateY(-50%) rotate(90deg)}.wall-bottom{bottom:-15px;left:50%;transform:translateX(-50%)}.wall-left{left:-25px;top:50%;transform:translateY(-50%) rotate(-90deg)}.window{position:absolute;top:20px;right:30px;width:40px;height:30px;background-color:#fff;border:2px solid #999}.window:before{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background-color:#999;transform:translateY(-50%)}.window:after{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background-color:#999;transform:translateX(-50%)}.summary-section{background-color:#f9f9f9;padding:20px;margin-bottom:20px}.summary-title{font-size:18px;font-weight:700;margin-bottom:20px;color:#333}.summary-row{display:flex;justify-content:space-between;margin-bottom:10px;font-size:14px}.summary-total{display:flex;justify-content:space-between;font-weight:700;font-size:16px;margin-top:15px;padding-top:15px;border-top:1px solid #ddd}.modal-add-to-cart{width:100%;background-color:#000;color:#fff;border:none;padding:15px;font-size:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-bottom:10px;transition:background-color 0.3s ease}.modal-add-to-cart:hover{background-color:#6e7888}.modal-add-to-cart:focus{outline:2px solid #000;outline-offset:2px}.modal-footer-text{text-align:center;color:#666;font-size:14px}@media screen and (max-width:1129px){.quantity-control{width:100%}}@media screen and (min-width:881px) and (max-width:990px){.quantity-display,.area-display{min-width:50%;padding:6px 20px}}@media screen and (max-width:880px){.quantity-control{flex-direction:column;width:100%;height:auto}.quantity-btn{width:100%;height:40px}.quantity-display,.area-display{min-width:100%}}@media screen and (max-width:767px){.tile-calculator-container{margin:0!important;padding:10px}.calculator-section{flex-direction:row;gap:0}.modal-content{width:95%;margin:5% auto}.quantity-control{overflow:visible!important}.modal-body{grid-template-columns:1fr;gap:20px;padding:20px}.area-header{grid-template-columns:60px 1fr 20px 1fr 40px 60px 25px;gap:8px}.area-row{grid-template-columns:60px 1fr 20px 1fr 40px 60px 25px;gap:8px}.quantity-display,.area-display{min-width:100%;padding:6px 20px}.quantity-number,.area-number{font-size:24px}.tile-calculator-btn{margin-top:20px}}@media screen and (max-width:480px){.area-header{display:none}.area-row{grid-template-columns:1fr;gap:10px;text-align:center}.area-row .area-input{width:100%;max-width:150px;margin:0 auto}.multiply-symbol,.equals-symbol{display:none}.quantity-control{flex-direction:column;width:100%}.quantity-btn{width:100%;height:40px}.tile-calc-notification{top:10px;right:10px;left:10px;max-width:none;transform:translateY(-100%)}.tile-calc-notification.show{transform:translateY(0)}.area-input-field{width:70px;font-size:14px}}