@tailwind base;@tailwind components;@tailwind utilities;html,body{height:100%;margin:0;padding:0}.form-container{display:flex;justify-content:center;align-items:center;height:100vh;background-image:url(back_ground.jpg);background-repeat:no-repeat;background-size:cover;background-position:center}.form-card{width:400px;padding:24px;background-color:#fff;box-shadow:0 4px 20px #0000001a;border-radius:12px}.form-title{font-size:1.25rem;font-weight:700;text-align:center;margin-bottom:1rem}.form-input{width:100%;padding:10px;margin-bottom:1rem;border:1px solid #ccc;border-radius:8px}.form-button{width:100%;padding:10px;background-color:#3b82f6;color:#fff;border:none;border-radius:8px;font-weight:700;cursor:pointer}.form-button:hover{background-color:#2563eb}.form-toggle{text-align:center;margin-top:1rem;font-size:.875rem;color:#2563eb;cursor:pointer}.form-toggle:hover{text-decoration:underline}.dashboard-container{display:flex;flex-direction:column;height:100vh}.navbar{background-color:#333;color:#fff;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center}.welcome{margin:0;font-size:1.5rem}.nav-links{display:flex;gap:1rem}.nav-link{color:#fff;text-decoration:none;font-weight:500;padding:.5rem 1rem;border-radius:6px;transition:background .3s}.nav-link:hover{background-color:#555}.page-content{flex-grow:1;padding:2rem;overflow-y:auto;background-color:#f4f4f4}.color-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem;padding:1rem}.color-card{display:flex;flex-direction:column;align-items:center;justify-content:center;background:white;padding:.5rem;border-radius:8px;box-shadow:0 2px 4px #0000001a;height:120px;text-align:center}.color-swatch{width:50px;height:50px;border-radius:6px;border:1px solid #e0e0e0;margin-bottom:.5rem}.color-name{font-family:Verdana,Geneva,sans-serif;font-size:.8rem;font-weight:400;color:#333;margin:0;text-align:center}.image-frame{margin-top:1rem;max-width:100%;max-height:400px;overflow:hidden;border-radius:12px;border:2px solid #ccc}.uploaded-img{width:100%;height:auto;object-fit:contain;display:block}.homepage-wrapper{width:100%;overflow:hidden;padding-top:64px;background-color:#f9f9f9}.photo-container{width:100%;height:500px;overflow:hidden;position:relative}.animated-photo{width:100%;height:100%;object-fit:cover;animation:revealFromLeft 1.2s ease-out forwards;clip-path:inset(0 100% 0 0)}@keyframes revealFromLeft{to{clip-path:inset(0 0 0 0)}}.page-title{font-family:Copperplate,serif;font-size:3rem;font-weight:700;text-align:center;margin-top:2rem;margin-bottom:.5rem;color:#1a1a1a;letter-spacing:1px}.page-subtitle{font-family:Lucida Handwriting,Lucida Sans Unicode,cursive;font-size:1.2rem;text-align:center;margin-bottom:2rem;color:#555;font-style:italic}.color-grid-container{width:100%;overflow-x:auto;padding-bottom:1rem;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#888 #f1f1f1}.color-grid-container::-webkit-scrollbar{height:8px}.color-grid-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.color-grid-container::-webkit-scrollbar-thumb{background:#888;border-radius:10px}.color-grid-container::-webkit-scrollbar-thumb:hover{background:#666}.color-grid{display:grid;grid-template-columns:repeat(5,294px);gap:2rem;padding:2rem;justify-items:center;width:max-content;margin:0 auto}@media (min-width: 1024px){.color-grid{grid-template-columns:repeat(auto-fit,minmax(294px,1fr));width:100%}.color-grid-container{overflow-x:visible}}.color-card{width:294px;height:294px;border-radius:20px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;cursor:pointer;position:relative;overflow:hidden;transition:all .3s ease;flex-shrink:0}.color-card:hover{box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.color-image{width:100%;height:100%;object-fit:cover;transition:transform .5s ease-in-out}.color-card:hover .color-image{transform:scale(1.05)}.color-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.7),transparent);padding:1rem}.color-name{font-family:Lucida Handwriting,Lucida Sans Unicode,cursive;font-size:1.25rem;font-weight:600;color:#fff;text-align:center;text-shadow:1px 1px 3px rgba(0,0,0,.5);margin:0}.color-detail-page{min-height:calc(100vh - 80px);background-color:#f9fafb;padding:2rem}.color-detail-page .container{max-width:1200px;margin:0 auto;display:flex;gap:2rem;flex-direction:column;align-items:stretch}@media (min-width: 768px){.color-detail-page .container{flex-direction:row}}.carousel-container{width:550px;height:457px;background-color:#f3f4f6;border-radius:12px;overflow:hidden}.carousel-image{width:549px;height:457px;object-fit:cover}.details-container{flex:1;height:457px;background-color:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 4px 12px #0000001a;overflow-y:auto}.color-name{font-size:2rem;font-weight:700;text-transform:capitalize;color:#1f2937;margin-bottom:1rem}.color-description{font-size:1rem;color:#374151;margin-bottom:1.5rem}.section{margin-bottom:1.5rem}.section h2{font-size:1.25rem;font-weight:600;color:#374151;margin-bottom:.5rem}.specs-list{list-style:none;padding-left:0;font-size:.95rem;color:#4b5563}.specs-list li{margin-bottom:.25rem}.center-screen{display:flex;align-items:center;justify-content:center;height:100vh}.error-text{color:red;font-size:1.5rem}.room-image-container{position:relative;width:100%;max-width:800px;margin:0 auto}.room-base-image{width:100%;display:block}.walls-overlay{position:absolute;top:0;left:0;width:100%;height:100%;mask-size:contain;mask-repeat:no-repeat;-webkit-mask-size:contain;-webkit-mask-repeat:no-repeat;mix-blend-mode:multiply}.font-copperplate{font-family:Copperplate,serif;letter-spacing:1px}.font-lucida{font-family:Lucida Handwriting,Lucida Sans Unicode,cursive}.image-frame{border-radius:12px;border:2px solid #ccc;transition:all .3s ease}.image-frame:hover{border-color:#999}.carousel .control-arrow,.carousel.carousel-slider .control-arrow{-webkit-transition:all .25s ease-in;-moz-transition:all .25s ease-in;-ms-transition:all .25s ease-in;-o-transition:all .25s ease-in;transition:all .25s ease-in;opacity:.4;filter:alpha(opacity=40);position:absolute;z-index:2;top:20px;background:none;border:0;font-size:32px;cursor:pointer}.carousel .control-arrow:focus,.carousel .control-arrow:hover{opacity:1;filter:alpha(opacity=100)}.carousel .control-arrow:before,.carousel.carousel-slider .control-arrow:before{margin:0 5px;display:inline-block;border-top:8px solid transparent;border-bottom:8px solid transparent;content:""}.carousel .control-disabled.control-arrow{opacity:0;filter:alpha(opacity=0);cursor:inherit;display:none}.carousel .control-prev.control-arrow{left:0}.carousel .control-prev.control-arrow:before{border-right:8px solid #fff}.carousel .control-next.control-arrow{right:0}.carousel .control-next.control-arrow:before{border-left:8px solid #fff}.carousel-root{outline:none}.carousel{position:relative;width:100%}.carousel *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.carousel img{width:100%;display:inline-block;pointer-events:none}.carousel .carousel{position:relative}.carousel .control-arrow{outline:0;border:0;background:none;top:50%;margin-top:-13px;font-size:18px}.carousel .thumbs-wrapper{margin:20px;overflow:hidden}.carousel .thumbs{-webkit-transition:all .15s ease-in;-moz-transition:all .15s ease-in;-ms-transition:all .15s ease-in;-o-transition:all .15s ease-in;transition:all .15s ease-in;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translateZ(0);position:relative;list-style:none;white-space:nowrap}.carousel .thumb{-webkit-transition:border .15s ease-in;-moz-transition:border .15s ease-in;-ms-transition:border .15s ease-in;-o-transition:border .15s ease-in;transition:border .15s ease-in;display:inline-block;margin-right:6px;white-space:nowrap;overflow:hidden;border:3px solid #fff;padding:2px}.carousel .thumb:focus{border:3px solid #ccc;outline:none}.carousel .thumb.selected,.carousel .thumb:hover{border:3px solid #333}.carousel .thumb img{vertical-align:top}.carousel.carousel-slider{position:relative;margin:0;overflow:hidden}.carousel.carousel-slider .control-arrow{top:0;color:#fff;font-size:26px;bottom:0;margin-top:0;padding:5px}.carousel.carousel-slider .control-arrow:hover{background:rgba(0,0,0,.2)}.carousel .slider-wrapper{overflow:hidden;margin:auto;width:100%;-webkit-transition:height .15s ease-in;-moz-transition:height .15s ease-in;-ms-transition:height .15s ease-in;-o-transition:height .15s ease-in;transition:height .15s ease-in}.carousel .slider-wrapper.axis-horizontal .slider{-ms-box-orient:horizontal;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-moz-flex;display:-webkit-flex;display:flex}.carousel .slider-wrapper.axis-horizontal .slider .slide{flex-direction:column;flex-flow:column}.carousel .slider-wrapper.axis-vertical{-ms-box-orient:horizontal;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-moz-flex;display:-webkit-flex;display:flex}.carousel .slider-wrapper.axis-vertical .slider{-webkit-flex-direction:column;flex-direction:column}.carousel .slider{margin:0;padding:0;position:relative;list-style:none;width:100%}.carousel .slider.animated{-webkit-transition:all .35s ease-in-out;-moz-transition:all .35s ease-in-out;-ms-transition:all .35s ease-in-out;-o-transition:all .35s ease-in-out;transition:all .35s ease-in-out}.carousel .slide{min-width:100%;margin:0;position:relative;text-align:center}.carousel .slide img{width:100%;vertical-align:top;border:0}.carousel .slide iframe{display:inline-block;width:calc(100% - 80px);margin:0 40px 40px;border:0}.carousel .slide .legend{-webkit-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;transition:all .5s ease-in-out;position:absolute;bottom:40px;left:50%;margin-left:-45%;width:90%;border-radius:10px;background:#000;color:#fff;padding:10px;font-size:12px;text-align:center;opacity:.25;-webkit-transition:opacity .35s ease-in-out;-moz-transition:opacity .35s ease-in-out;-ms-transition:opacity .35s ease-in-out;-o-transition:opacity .35s ease-in-out;transition:opacity .35s ease-in-out}.carousel .control-dots{position:absolute;bottom:0;margin:10px 0;padding:0;text-align:center;width:100%;z-index:1}@media (min-width: 960px){.carousel .control-dots{bottom:0}}.carousel .control-dots .dot{-webkit-transition:opacity .25s ease-in;-moz-transition:opacity .25s ease-in;-ms-transition:opacity .25s ease-in;-o-transition:opacity .25s ease-in;transition:opacity .25s ease-in;opacity:.3;filter:alpha(opacity=30);box-shadow:1px 1px 2px #000000e6;background:#fff;border-radius:50%;width:8px;height:8px;cursor:pointer;display:inline-block;margin:0 8px}.carousel .control-dots .dot.selected,.carousel .control-dots .dot:hover{opacity:1;filter:alpha(opacity=100)}.carousel .carousel-status{position:absolute;top:0;right:0;padding:5px;font-size:10px;text-shadow:1px 1px 1px rgba(0,0,0,.9);color:#fff}.carousel:hover .slide .legend{opacity:1}