.bg-gradient-light{background:linear-gradient(135deg,#f8f9ff 0%,#fff 100%)}.city-search-container{position:relative;width:100%}.search-input-wrapper{position:relative;width:100%}.search-icon{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:#667eea;font-size:1.2rem;z-index:2;pointer-events:none}.city-search-input{border:2px solid #e2e8f0;border-radius:60px;padding:.875rem 1.25rem .875rem 3rem;font-size:1rem;transition:all .3s ease;background:#fff;width:100%}.city-search-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px rgba(102,126,234,.15)}.btn-clear{position:absolute;right:15px;top:50%;transform:translateY(-50%);background:none;border:none;color:#a0aec0;cursor:pointer;transition:all .2s;z-index:2}.btn-clear:hover{color:#667eea}.city-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:.5rem;background:#fff;border-radius:20px;box-shadow:0 10px 40px rgba(0,0,0,.15);z-index:1000;max-height:400px;overflow:hidden;animation:slideDown .3s ease;border:1px solid rgba(102,126,234,.2)}@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}.dropdown-header{padding:1rem 1.25rem;background:#f8f9ff;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center;font-weight:600;color:#4a5568}.dropdown-header small{color:#667eea;font-weight:500}.dropdown-list{max-height:340px;overflow-y:auto;padding:.5rem 0}.dropdown-list::-webkit-scrollbar{width:6px}.dropdown-list::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.dropdown-list::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:10px}.dropdown-list::-webkit-scrollbar-thumb:hover{background:#667eea}.city-item{display:flex;align-items:center;padding:.75rem 1.25rem;color:#2d3748;text-decoration:none;transition:all .2s ease;border-left:3px solid transparent}.city-item:hover{background:linear-gradient(90deg,#f8f9ff 0%,#fff 100%);border-left-color:#667eea;transform:translateX(5px)}.city-item i{color:#667eea;font-size:1rem}.popular-city-badge{display:inline-block;padding:.5rem 1rem;background:#fff;border:1px solid #e2e8f0;border-radius:50px;color:#4a5568;text-decoration:none;font-size:.875rem;transition:all .3s ease}.popular-city-badge:hover{background:#667eea;border-color:#667eea;color:#fff;transform:translateY(-2px);box-shadow:0 5px 15px rgba(102,126,234,.3)}@media (max-width:768px){.city-search-input{padding:.75rem 1rem .75rem 2.75rem;font-size:.95rem}.search-icon{left:15px;font-size:1rem}.city-dropdown{margin-top:.25rem;max-height:350px}.city-item{padding:.625rem 1rem;font-size:.9rem}}.popular-city-badge{display:inline-flex;align-items:center;padding:.5rem 1rem;background:#fff;border:1px solid #e2e8f0;border-radius:50px;color:#4a5568;text-decoration:none;font-size:.875rem;transition:all .3s ease;cursor:pointer;pointer-events:auto;z-index:10;position:relative}.popular-city-badge:hover{background:#667eea;border-color:#667eea;color:#fff;transform:translateY(-2px);box-shadow:0 5px 15px rgba(102,126,234,.3);text-decoration:none}