*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:#f7f7f7;color:#333}#root{width:100%;height:100%;display:flex;flex-direction:column}a{text-decoration:none;color:inherit}button{cursor:pointer;border:none;outline:none}img{max-width:100%;height:auto}.navbar{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;background-color:#fff;box-shadow:0 2px 4px #0000001a;position:sticky;top:0;z-index:1000}.navbar-brand{color:red;display:flex;align-items:center}.navbar-brand h1{font-size:1.8rem;font-weight:700;color:red;margin:0}.nav-links{display:flex;justify-self:center;align-items:center;gap:2rem}.nav-links a{color:#484848;text-decoration:none;font-weight:500;transition:color .3s ease;padding-bottom:.25rem;border-bottom:2px solid transparent}.nav-links a:hover,.nav-links a.active{color:#ff385c;border-bottom-color:#ff385c}.login-btn{background-color:#ff385c;color:#fff;border:none;padding:.5rem 1.5rem;border-radius:25px;cursor:pointer;font-weight:500;transition:background-color .3s ease;position:relative;overflow:hidden}.login-btn:hover{background-color:#e31c5f}.login-btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:#ff385c1a;border-radius:50%;transform:translate(-50%,-50%);transition:width .4s ease,height .4s ease}.login-btn:hover:before{width:300%;height:300%}.login-btn.active:before{width:300%;height:300%;background:#ff385c26}.user-profile{position:relative}.profile-button{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border:none;background:#fff;cursor:pointer;border-radius:20px;transition:all .3s ease;box-shadow:0 2px 4px #0000001a;position:relative;overflow:hidden}.profile-button:hover{box-shadow:0 2px 8px #00000026;transform:translateY(-1px)}.profile-button.active{background:#f8f8f8;box-shadow:0 2px 8px #00000026}.profile-icon{font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:transform .3s ease}.profile-button:hover .profile-icon{transform:scale(1.1)}.profile-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:#fff;border-radius:12px;box-shadow:0 4px 12px #00000026;min-width:200px;padding:.5rem;animation:menuSlide .3s ease forwards;transform-origin:top right}.profile-header{display:flex;align-items:center;gap:1rem;padding:1rem;border-bottom:1px solid #eee}.avatar-large{font-size:2.5rem}.user-info{display:flex;flex-direction:column}.user-name{font-weight:500;color:#333}.user-email{font-size:.9rem;color:#666}.profile-dropdown a,.profile-dropdown button{display:flex;align-items:center;gap:.5rem;width:100%;padding:.75rem 1rem;color:#484848;text-decoration:none;border:none;background:none;cursor:pointer;transition:all .3s ease;border-radius:8px}.profile-dropdown a:hover,.profile-dropdown button:hover{background:#f7f7f7;color:#ff385c}.login-modal{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:1000}.login-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000080}.login-content{position:relative;background:#fff;padding:2rem;border-radius:12px;width:100%;max-width:400px;z-index:1;animation:modalSlide .3s ease}.login-content h2{margin-bottom:1.5rem;color:#484848;text-align:center}.input-group{margin-bottom:1rem}.input-group label{display:block;margin-bottom:.5rem;color:#484848;font-weight:500}.input-group input{width:100%;padding:.75rem;border:1px solid #ddd;border-radius:8px;font-size:1rem;transition:border-color .3s ease}.input-group input:focus{outline:none;border-color:#ff385c}.login-submit{width:100%;padding:.75rem;background:#ff385c;color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:500;margin-top:1rem;transition:background .3s ease}.login-submit:hover{background:#e31c5f}.close-btn{position:absolute;top:1rem;right:1rem;font-size:1.5rem;color:#666;background:none;border:none;cursor:pointer;padding:.5rem;transition:color .3s ease}.close-btn:hover{color:#ff385c}@keyframes menuSlide{0%{opacity:0;transform:scale(.95) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes modalSlide{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.navbar{padding:1rem}.nav-links{gap:1rem}.profile-dropdown{right:-1rem}.login-content{margin:1rem;padding:1.5rem}}.hotel-card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 4px #0000001a;transition:transform .3s ease;cursor:pointer}.hotel-card:hover{transform:translateY(-4px);box-shadow:0 4px 8px #0000001a}.hotel-image{width:100%;height:200px;object-fit:cover}.hotel-info{padding:1rem}.hotel-info h3{margin:0 0 .5rem;font-size:1.2rem;color:#333}.location{color:#666;margin-bottom:1rem}.hotel-features{display:flex;gap:1rem;margin-bottom:1rem;color:#666}.price-book{display:flex;justify-content:space-between;align-items:center}.price{font-size:1.2rem;font-weight:700;color:#333}.price span{font-size:.9rem;color:#666;font-weight:400}.book-now{background:#ff385c;color:#fff;border:none;padding:.5rem 1rem;border-radius:20px;cursor:pointer;transition:background-color .3s ease}.book-now:hover{background:#e31c5f}.page-container{width:100%;min-height:100vh;padding:4rem 2rem;background:linear-gradient(to bottom,#f8f9fa,#fff)}.hero-section{background:linear-gradient(#ffffff80,#00000080),url(https://images.unsplash.com/photo-1566073771259-6a8506099945?ixlib=rb-4.0.3) center;height:60vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2rem;color:#fff}.hero-section h1{font-size:3rem;margin-bottom:1rem;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.hero-section p{font-size:1.2rem;margin-bottom:2rem;text-shadow:1px 1px 2px rgba(204,147,147,.3)}.search-container{width:100%;max-width:600px;margin:0 auto}.search-bar{background:#fff;padding:1rem;border-radius:50px;box-shadow:0 4px 12px #00000026}.search-input{width:100%;padding:.5rem 1rem;border:none;font-size:1.1rem;outline:none}.success-message{color:#155724;background-color:#d4edda;border:1px solid #c3e6cb;padding:1rem;margin-bottom:1rem;border-radius:4px;display:flex;justify-content:space-between;align-items:center}.success-message .close-btn{background:none;border:none;color:#155724;font-size:1.2rem;cursor:pointer;padding:0 .5rem}.success-message .close-btn:hover{opacity:.7}.error-message{color:#721c24;background-color:#f8d7da;border:1px solid #f5c6cb;padding:1rem;margin-bottom:1rem;border-radius:4px}.hotels-section{max-width:1200px;margin:2rem auto;padding:0 2rem}.hotels-section h2{font-size:2rem;color:#000;margin-bottom:2rem}.hotels-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem;margin-top:2rem}.hotel-link{text-decoration:none;color:inherit}.no-results{text-align:center;padding:2rem;color:#666}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-top:1.5rem}.page-container h1{text-align:center;font-size:3.5rem;color:#ff385c;margin-bottom:2rem;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.1)}.about-section{margin-bottom:3rem;padding:2rem;background:#fff;border-radius:12px;transition:transform .3s ease}.about-section h2{color:#333;font-size:2.2rem;margin-bottom:1.5rem;position:relative;padding-bottom:.5rem}.about-section h2:after{content:"";position:absolute;bottom:0;left:0;width:60px;height:4px;background:#ff385c;border-radius:2px}.about-section p{color:#666;line-height:1.8;font-size:1.1rem}.feature{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 4px 15px #0000000d;transition:transform .3s ease}.feature:hover{transform:translateY(-5px)}.feature h3{color:#ff385c;font-size:1.5rem;margin-bottom:1rem}.feature p{color:#666;line-height:1.6}@media (max-width: 768px){.page-container{padding:2rem 1rem}.page-container h1{font-size:2.5rem}.about-section{margin-bottom:3rem;padding:2rem;background:#fff;border-radius:12px;transition:transform .3s ease}.about-section h2{font-size:1.8rem}.feature{padding:1.5rem}}.feature{text-align:center;padding:1.5rem;background:#f8f8f8;border-radius:8px}.feature h3{color:#333;margin-bottom:.5rem}.contact-content{display:grid;grid-template-columns:1fr 2fr;gap:3rem;background:#fff;padding:2rem;border-radius:12px;box-shadow:0 2px 8px #0000001a}.contact-info{display:flex;flex-direction:column;gap:2rem}.contact-method{background:#f8f8f8;padding:1.5rem;border-radius:8px}.contact-method h3{color:#ff385c;margin-bottom:.5rem}.contact-form{display:flex;flex-direction:column;gap:1rem}.form-group input,.form-group textarea{width:100%;padding:1rem;border:1px solid #ddd;border-radius:8px;font-size:1rem}.form-group textarea{min-height:150px;resize:vertical}.booking-form button{width:100%;padding:1rem;background:#ff385c;color:#fff;border:none;border-radius:4px;font-size:1.1rem;cursor:pointer;transition:all .3s ease}.booking-form button:disabled{background:#ccc;cursor:not-allowed}.price-summary{background:#f8f9fa;padding:1rem;border-radius:8px;margin:1rem 0}.price-row{display:flex;justify-content:space-between;padding:.5rem 0;color:#666}.price-row.total{border-top:1px solid #ddd;margin-top:.5rem;padding-top:1rem;font-weight:700;color:#333;font-size:1.1rem}.submit-btn{background-color:#ff385c;color:#fff;padding:1rem 2rem;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.submit-btn:hover{background-color:#e31c5f}.home-page{min-height:calc(100vh - 80px);background:linear-gradient(#00000080,#00000080),url(https://images.unsplash.com/photo-1571896349842-33c89424de2d?ixlib=rb-4.0.3) center/cover;display:flex;flex-direction:column;align-items:center;padding:2rem}.hero-section{text-align:center;color:#fff;max-width:800px;margin:0 auto;padding:4rem 2rem;animation:fadeIn 1s ease}.hero-section h1{font-size:3.5rem;font-weight:700;margin-bottom:1rem;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.hero-section p{font-size:1.2rem;margin-bottom:2rem;text-shadow:1px 1px 2px rgba(255,255,255,.3);opacity:1}.featured-hotels{margin-top:4rem;width:100%;max-width:1200px;background:#fffffff2;padding:2rem;border-radius:12px;box-shadow:0 4px 20px #00000026;margin:0 auto}.hotels-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;padding:1rem;animation:fadeIn .6s ease}.search-bar{margin:2rem auto;display:flex;align-items:center;gap:1rem;width:100%;max-width:600px;background:#fff;padding:.5rem;border-radius:30px;box-shadow:0 4px 12px #00000026}.search-bar input{flex:1;border:none;padding:.75rem 1.5rem;font-size:1rem;outline:none;background:transparent}.search-bar button{background:#ff385c;border:none;padding:.75rem 1.5rem;border-radius:25px;color:#fff;font-size:1.1rem;cursor:pointer;transition:background-color .3s ease}.search-bar button:hover{background:#e31c5f}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.page-container{padding:2rem}.contact-content,.features-grid{grid-template-columns:1fr}}.cont.about-content{max-width:1200px;margin:0 auto;border-radius:16px;box-shadow:0 4px 20px #0000001a;display:grid;grid-template-columns:1fr 2fr;gap:3rem;background:#fff;padding:2rem}@media (max-width: 768px){.cont.about-content{grid-template-columns:1fr}}.app{text-align:center;padding:2rem;background-color:#f8f8f8;min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden}.app h1{color:#333;margin-bottom:1rem}.app p{color:#666}main{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:20px}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3;margin-bottom:1rem;color:#2c3e50}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.75rem}button{cursor:pointer;font-family:inherit;border:none;padding:10px 20px;border-radius:8px;font-weight:500;transition:all .3s ease}.btn-primary{background-color:#ff385c;color:#fff}.btn-primary:hover{background-color:#e31c5f;transform:translateY(-1px)}a{color:inherit;text-decoration:none;transition:color .3s ease}a:hover{color:#ff385c}input,select,textarea{font-family:inherit;font-size:1rem;padding:10px;border:1px solid #ddd;border-radius:8px;transition:border-color .3s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:#ff385c}.container{max-width:1200px;margin:0 auto;padding:0 20px}.text-center{text-align:center}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.mb-4{margin-bottom:2rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn .3s ease-in}@media (max-width: 768px){main{padding:16px}h1{font-size:2rem}h2{font-size:1.75rem}h3{font-size:1.5rem}.container{padding:0 16px}}.search-bar button{background-color:#ff385c;color:#fff;border:none;padding:0 2rem;border-radius:25px;cursor:pointer;font-weight:500;transition:background-color .3s ease}.search-bar button:hover{background-color:#e31c5f}.hotels-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem;padding:4rem;max-width:1400px;margin:0 auto}.no-results{grid-column:1 / -1;text-align:center;padding:3rem;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.no-results h2{color:#333;margin-bottom:1rem}.no-results p{color:#666}@media (max-width: 768px){.hero h1{font-size:2rem}.search-bar{flex-direction:column}.search-bar button{padding:1rem}.hotels-grid{grid-template-columns:1fr}}.settings-page{padding:2rem;max-width:800px;margin:0 auto}.settings-container{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:2rem}.settings-container h1{margin-bottom:2rem;color:#333}.settings-section{margin-bottom:2rem;padding-bottom:2rem;border-bottom:1px solid #eee}.settings-section:last-child{border-bottom:none}.settings-section h2{color:#666;font-size:1.2rem;margin-bottom:1rem}.settings-form{display:flex;flex-direction:column;gap:1rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{color:#333;font-weight:500}.form-group input[type=text],.form-group input[type=email],.form-group select{padding:.75rem;border:2px solid #eee;border-radius:8px;font-size:1rem;transition:all .3s ease}.form-group input:hover,.form-group select:hover{border-color:#ddd}.form-group input:focus,.form-group select:focus{border-color:#ff385c;outline:none;box-shadow:0 0 0 3px #ff385c1a}.form-group.checkbox{flex-direction:row;align-items:center;gap:1rem}.form-group.checkbox input[type=checkbox]{width:20px;height:20px;accent-color:#ff385c}.settings-actions{margin-top:2rem;display:flex;justify-content:flex-end}.save-btn{background-color:#ff385c;color:#fff;border:none;padding:.75rem 2rem;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .3s ease}.save-btn:hover{background-color:#e31c5f;transform:translateY(-1px);box-shadow:0 4px 12px #ff385c33}.save-btn:active{transform:translateY(0);box-shadow:none}@media (max-width: 768px){.settings-page,.settings-container{padding:1rem}}.bookings-page{padding:2rem;max-width:1000px;margin:0 auto}.bookings-container h1{margin-bottom:2rem;color:#333}.bookings-filters{display:flex;gap:1rem;margin-bottom:2rem}.bookings-filters button{padding:.5rem 1.5rem;border:none;border-radius:25px;background:#f5f5f5;color:#666;font-weight:500;cursor:pointer;transition:all .3s ease}.bookings-filters button:hover{background:#eee;color:#333}.bookings-filters button.active{background:#ff385c;color:#fff}.booking-card{display:flex;gap:2rem;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:1.5rem;margin-bottom:1.5rem;transition:transform .3s ease,box-shadow .3s ease}.booking-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.booking-image{width:200px;height:150px;border-radius:8px;overflow:hidden}.booking-image img{width:100%;height:100%;object-fit:cover}.booking-details{flex:1}.booking-details h3{margin:0 0 1rem;color:#333;font-size:1.2rem}.booking-dates{display:flex;gap:2rem;margin-bottom:1rem}.booking-dates .label,.booking-price .label{color:#666;margin-right:.5rem}.booking-dates .date{color:#333;font-weight:500}.booking-price .amount{color:#333;font-weight:600}.booking-status{display:inline-block;padding:.25rem 1rem;border-radius:15px;font-size:.9rem;font-weight:500;text-transform:capitalize;margin-top:1rem}.booking-status.upcoming{background:#e3f2fd;color:#1976d2}.booking-status.completed{background:#e8f5e9;color:#2e7d32}.booking-status.cancelled{background:#ffebee;color:#c62828}.booking-actions{display:flex;flex-direction:column;gap:.5rem;justify-content:center}.booking-actions button{padding:.5rem 1rem;border:none;border-radius:8px;font-weight:500;cursor:pointer;transition:all .3s ease}.booking-actions .view-details{background:#f5f5f5;color:#333}.booking-actions .view-details:hover{background:#eee}.booking-actions .cancel-booking{background:#fff0f3;color:#ff385c}.booking-actions .cancel-booking:hover{background:#ffe4e9}@media (max-width: 768px){.bookings-page{padding:1rem}.booking-card{flex-direction:column;gap:1rem}.booking-image{width:100%;height:200px}.booking-dates{flex-direction:column;gap:.5rem}.booking-actions{flex-direction:row;justify-content:flex-start}}
